今回はサイドバーへのオリジナルモジュールの実装方法について。

サイドバーの実装については以前ご紹介したこちらのサイトを参照すれば基本的なことはできます。

基本を踏まえた上で本ブログでは少し手を入れた実装にしています。

本ブログのsidebar.phpのコードはざっくりと説明すると以下の通り。

sidebar.php

<div id="sidebar">
	<?php get_template_part( '/widgets/ad' ); ?>
	<?php get_template_part( '/widgets/amazon' ); ?>
	<?php get_template_part( '/widgets/search' ); ?>
	<?php get_template_part( '/widgets/category' ); ?>
	<?php get_template_part( '/widgets/app' ); ?>
 
	<?php if ( is_active_sidebar( 'sidebar-1' ) ) :
		dynamic_sidebar( 'sidebar-1' );
	else: ?>
	<?php endif; ?>
 
	<?php get_template_part( '/widgets/random' ); ?>
</div>

以下図のようにWordPressの「外観 -> ウィジェット」で操作できるウィジェット(プラグイン)も利用しつつ、完全にお手製のオリジナルウィジェットも一緒に配置しています。

blog020

このような実装にした理由としては、

  • WordPressの「外観 -> ウィジェット」ではPHPが利用できない(Exec-PHPを利用する方法などあるみたいですがセキュリティ上好ましくない気もします)
  • WordPressの「外観 -> ウィジェット」はあまりレイアウトなどに自由が利かない(特にカテゴリの表示には手を入れたかったのと、ランダム記事の表示なんかはプラグインを探せばあるかもしれませんが自前で実装する場合はPHP使えないと無理ゲーです)

実装方法はすでにソースに示した通りで、get_template_part関数でオリジナルウィジェットを呼び出します。オリジナルウィジェットといってもたいしたことはなく簡単なHTMLやPHPです。

呼び出すオリジナルウィジェットの例:

category.php

<aside>
	<div class="sub_title"><img src="&lt;?php echo get_template_directory_uri(); ?&gt;/img/side_category.png" width="300" height="33" alt="category"></div>
	<div class="sub_content">
		<ul class="tree-menu">
			<?php wp_list_categories('orderby=order&show_count=1&title_li=');?>
		</ul>
	</div>
</aside>

トラックバック

コメントする

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です