EOS Kiss X7・8000D・α7のお散歩カメラブログ。カメラとか写真とか料理とか。

ぽちろぐ

サイドバーのウィジェットごとにに名前をつけたい。

     2015/09/28   WordPress・テーマ   , , , ,  ぽち

WordPressのテーマ作成で

フルスクラッチでテンプレート内に機能をすべてphpで書き込むのもカッコ良いのですが、便利なウィジェット(widget)がたくさん提供されているので使いたいわけです。

ウィジェット置き場(dynamic_sidebar)はテーマのfunctions.phpに宣言すれば、いくつでも作れます。もともとサイドバーで使われていた物なので、ダイナミックサイドバーと言うのかな?

if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(9) )
register_sidebars(1,
array(
‘name’=>’サイドバーウイジェット’,
‘before_widget’ => ‘<div class=”widgetbox”>’,
‘after_widget’ => ‘</div>’,
‘before_title’ => ‘<h3>’,
‘after_title’ => ‘</h3>’,
));

(9)というのは、全部で9個のウィジェット置き場を作っていますよ、という意味です。

ウィジェットを呼び出すには、例えばサイドバーに置くならsidebar.phpを編集し、以下のコードを設置します。もちろんフッタ(footer.php)に書いてもかまいません。

<?php if ( function_exists(‘dynamic_sidebar’) && dynamic_sidebar(4) ) : else : ?>
<?php endif; ?>

(4)というのは、functions.php内で4番目に作ったウィジェット置き場という意味です。

ウィジェット置き場(dynamic_sidebar)に設置するウィジェットに名前を付けたい

例えばぽちろぐでは上から

  • テキストウィジェット(広告コードが貼ってある)
  • 人気の投稿ウィジェット
  • 検索ウィジェット
  • テキストウィジェット(おすすめ商品が貼ってある)
  • タグクラウドウィジェット・・・・

を使っています。

上のfunctions.phpで
‘before_widget’ => ‘<div class=”widgetbox”>’,
と宣言しているように、各ウィジェットは<div>タグで囲われています。さらにクラス名”widgetbox”が付けられています。

しかし、スタイルシートからウィジェット別にid・classを指定する手段がありません。全部widgetboxです。

  • 「人気の投稿」は読みやすいように文字サイズを大きくしたい!
  • 「タグクラウド」はあればいいや。文字は小さめで薄い色にしよう。

といった個別指定ができないのです!

「idとしてウィジェット名か、せめてウィジェットを呼び出した番号が割り振れればいいなあ」と、「wordpress dynamic_sidebar」等のキーワードで探している内にやり方を見つけました。

‘before_widget’ => ‘<div id=”%1$s” class=”widgetbox”>’,

‘before_widget’ => ‘<div id=%1$s class=”widgetbox”>’, //修正しました

%1$sがウィジェット名が格納されている変数です。こんなの、知らなければ分からないですよね〜。

情報を見つけたのはここ。

http://tenderfeel.xsrv.jp/wordpress/reference/84/

おかげでウィジェットごとにスタイルを楽々設定できるようになりました(^_^

     2015/09/28   WordPress・テーマ   , , , ,  ぽち

コメントを残す

 こちらの記事も読んで見ましょう

サイドバーのウィジェットごとにに名前をつけたい。 EOS Kiss X7・8000D・α7のお散歩カメラブログ。カメラとか写真とか料理とか。

Copyright©ぽちろぐ,2015 All Rights Reserved.

ページ先頭へ