❸sidebar部分を書き換え sidebar.php-基礎編-

2016/03/31 2016/04/04

書き換え sidebar.php

管理画面にウィジェットの項目を追加するには、「functions.php」にヴィジェット用の関数を作成する。

functions.phpを開いて、下記を追加記述

<?php
register_nav_menus(array(
		'main_navigation' => 'Primary Navigation'
	)
);
?>
<?php
register_sidebar( array(
'name' => 'サイドバーウィジェット',
'id' => 'sidebar',
'description' => 'サイドバーのウィジェットエリア',
'before_widget' => '<div class="section">',
'after_widget' => '</div>',
) );
?>

<?php

register_nav_menus(array(

'main_navigation' => 'Primary Navigation'

)

);

<?php

register_sidebar( array(

'name' => 'サイドバーウィジェット',

'id' => 'sidebar',

'description' => 'サイドバーのウィジェットエリア',

'before_widget' => '<div class="section">',

'after_widget' => '</div>',

) );

現在の記述 sidebar.php

<!-- sidebar -->
     <div id="sidebar">

<div class="section">
<form role="search" method="get" id="searchform" action="#" >
<label class="screen-reader-text" for="s"></label>
<input type="text" value="" name="s" id="s" />
<input type="submit" id="searchsubmit" value="検索" />
</form>
</div>

        <div class="section">
           <h2>Category</h2>
           <ul>
           <li><a href="elementary.html">基礎知識</a></li>
           <li><a href="wordpress.html">WordPress</a></li>
           </ul>
        </div><!-- /.section -->


        <div class="section">
           <h2>Tag</h2>
           <a href="#">タグ</a>
           <a href="#">php</a>
           <a href="#">html</a>
           <a href="#">相対パス</a>
           <a href="#">絶対パス</a>
           <a href="#">ツール</a>
           <a href="#">プラグイン</a>
        </div><!-- /.section -->

     </div>
<!-- /sidebar -->

</form>

</div>

<h2>Category</h2>

<ul>

<li><a href="wordpress.html">WordPress</a></li>

</ul>

</div>

<a href="#">プラグイン</a>

</div>

</div>

検索フォームは別ファイル化で「searchform.php」として保存

<div class="section">
<form role="search" method="get" id="searchform" action="#" >
<label class="screen-reader-text" for="s"></label>
<input type="text" value="" name="s" id="s" />
<input type="submit" id="searchsubmit" value="検索" />
</form>
</div>

</form>

</div>

<form role="search" method="get" id="searchform" action="<?php bloginfo('url'); ?>" >
<label class="screen-reader-text" for="s"></label>
<input type="text" value="" name="s" id="s" />
<input type="submit" id="searchsubmit" value="検索" />
</form>

</form>

WordPressテンプレタグと、phpで書き換えた記述 sidebar.php

	<!-- sidebar -->
      <div id="sidebar">


<!-- sidebar -->
<?php if ( is_active_sidebar( 'sidebar' ) ) :
dynamic_sidebar( 'sidebar' );
else: ?>
<p>ウィジェットが設定されていません。</p>
<?php endif; ?>
<!-- /sidebar -->



      </div>
	<!-- /sidebar -->