PC、ゲーム、デジタル機器などの初心者向けの話題や小技などをつらつらと……

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

Loading...

【WordPress】 ウィジェット利用のための記述をfunction.phpに追加

 現在作成中のテーマは完全にゼロからのオリジナルなので、このままではWprdPressのウィジェット機能は使えないままとなるため、ウィジェット機能使用のための記述をfunction.phpに追加する。

<?php register_sidebar(); ?>

 上記がfunction.phpに記述する、ウィジェット使用のためのコードの基本形。ここに必要なパラメータを追加記述して、現在のテーマに必要な形に仕上げていく。

追加可能なパラメータ

 追加できるパラメータには以下のような種類がある。

<?php
register_sidebar( array(
'name' => '',
'id' => '',
'description' => '',
'before_widget' => '',
'after_widget' => '',
'before_title'  => '',
'after_title'   => '',
) );
?>
  • name:サイドバー名(デフォは'sprintf(__('Sidebar %d'), $i )')
  • id:サイドバーのID(デフォは'sidebar-$i')
  • description:サイドバーの説明
  • before_widget:ウィジェット前のテキスト(デフォは'<li id="%1$s" class="widget %2$s">')
  • after_widget:ウィジェット後のテキスト(デフォは</li>)
  • before_title:タイトル前のテキスト(デフォは'<h2 class="widgettitle">')
  • after_title:タイトル後のテキスト(デフォは'</h2>')

 これは以下のような記述でも追加可能。

<?php register_sidebar( $args ); ??>

<?php $args = array(
'name' => '',
'id' => '',
'description' => '',
'before_widget' => '',
'after_widget' => '',
'before_title'  => '',
'after_title'   => '',
) );
?>

 これらのパラメータは全て埋める必要はなく、必要な部分のみを抜粋記述可能。

現在作成中のテーマに合わせたパラメータを追加記述

 取りあえず現時点でウィジェットに必要と考えているのは、各ウィジェットの標準タグ前後にclass付きの<div>~</div>の追加のみのため、これらを満たすパラメータ記述を追加したのが以下となる。

<?php
register_sidebar( array(
'before_widget' => '<div class="widget">',
'after_widget' => '</div>',
) );
?>

 WordPressのウィジェットは、デフォ状態では全体が<li>~</li>で囲まれており、各タイトル部分は<h2>となっている。
 今回は'before_widget'に<div>、'after_widget'に</div>,を指定して、ウィジェットを<li>ではなく<div>で囲むように変更することで、タグ記述上の問題(<li>が<ul>に囲まれていない)を解消した。タイトルの<h2>は別途CSSで指定することで装飾予定。

 ちなみにclassではなくIDを追加したい場合は、'id'欄に追加したいIDを記述する。

ウィジェット毎に異なるID、classを付与した場合

 上記の方法だと追加するウィジェット全てに同じ内容が反映される。もしウィジェット毎に異なるIDやclassを付けたい場合は、以下のように記述する。

<?php
register_sidebar( array(
'before_widget' => '<div id="%1$s" class="widget %2$s">',
'after_widget' => '</div>',
) );
?>

 これでウィジェットを囲む<div>にはウィジェット毎に各ウィジェット名が自動記述されるため、CSSにてデザインが容易になる。

ウィジェットを複数追加するための記述

 テーマ内に複数のウィジェットを追加する場合、追加数分だけ記述も追加する。

<?php
register_sidebar(1);
register_sidebar(2);
?>

register_sidebar()の()内に(1)(2)等のように各ウィジェットを区別する記述を行い、ウィジェットを呼び出すテンプレタグに、

<?php dynamic_sidebar(1); ?>
<?php dynamic_sidebar(2); ?>

 というようにどのウィジェットを表示するかの記述を行えば、テーマ内で複数のウィジェットを利用できる。

 他にもウィジェットを便利にカスタマイズする方法はあるが、取りあえず今回必要なのは基本中の基本部分のみだったので、使用するウィジェットはひとつ、カスタマイズも必要最小限に留めておく。



Loading...
コメント
コメントの投稿
【Font & Icon】
管理者にだけ表示を許可する
プロフィール

雪陽炎

Author:雪陽炎
 PCやデジタル機器類いじりの他にも、あれやこれやと趣味を持つ器用貧乏な奈良県民。
 初心者向け兼自身の忘備録としてPC及びデジタル機器関連の情報をまとめてます。

参加ブログランキング

にほんブログ村 PC家電ブログ パソコン・周辺機器へ にほんブログ村 PC家電ブログ 家電・AV機器へ
にほんブログ村 PC家電ブログ PCオーディオへ
人気ブログランキングへ
人気ブログランキングへ
最新記事
スポンサ-ドリンク
最新コメント
最新トラックバック
Amazon
楽天
ブロとも申請フォーム

この人とブロともになる

関連記事Loader

[猫カフェ]futaha

スポンサードリンク
本館/別館サイト
カテゴリ
ブックマーク
最近のチェックリスト / PC関連
最近のチェックリスト / AV関連
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。