Luxeritasにフロントページ専用のウィジェットエリアを追加する
高速WordPress無料テーマ Luxeritas に、フロントページ（トップページ）の１ページ目専用（２ページ以降は表示されない）のウィジェットエリアを作る方法。パソコン向けページとモバイル・スマホ向けページにわけてウィジェットエリアを作成した。
フロントページ専用ウィジェットエリア
豊富に至れり尽くせりにウィジェットがあるLuxeritasなので、「これ以上ウィジェットエリアはいらんだろう」と思うけど、トップページの１ページ目だけに表示されるウィジェットエリアを作ってみた。ＰＣとモバイルにわけてウィジェットを作成した。
別段２ページ以降をnoindexに設定すればいい話なのだが「同じ内容を複数ページに表示するのはSEO的によくないんじゃない？」というど素人の浅はかな考えで１ページだけに表示、別段ＰＣだけに表示するウィジェットをつくればいい話なのだが「スマホでもなんかつけたいなあ」という無駄な考えでＰＣとモバイルで違う表示、そもそも別段そんなもんプロフィールページ作ればいい話なのだが「ブログブログしたのはいやなんだなあ」というわがままでフロントページ専用のウィジェットエリアを作った。
widgetエリアをつくる
Luxeritasの子テーマの「テーマのための関数 (functions.php)」に下のコードを追加してフロントページ専用のウィジェットエリアを作る。
//PC用
register_sidebar(array(
'name' => 'フロントページ用のウィジェット' ,
'id' => 'posts-list-upper-front' ,
'description' => 'フロントページ用のウィジェット',
'before_widget' => '<div class="widget posts-list-upper-front widget_text">',
'after_widget' => '</div>',
'before_title' => '',
'after_title' => ''
));
//スマホ・モバイル用
register_sidebar(array(
'name' => 'フロントページ用のウィジェット（モバイル）' ,
'id' => 'posts-list-upper-front-mob' ,
'description' => 'フロントページ用のウィジェット（モバイル）',
'before_widget' => '<div class="widget posts-list-upper-front-mob widget_text">',
'after_widget' => '</div>',
'before_title' => '',
'after_title' => ''
));うまくいくと外観→ウィジェットに「フロントページ用のウィジェット」と「フロントページ用のウィジェット（モバイル）」が現れるはず。
フロントページ用のウィジェットエリアにテキストウィジェットを追加して編集、挨拶やサイトの説明、能書き、言い訳なんかを書く。もちろんインパクトの画像なんかも貼りたい。
親テーマにウィジェットエリア表示のコードを貼り付ける
<div id="list">
<?php
global $luxe, $wp_query;
// フロントページ用のウィジェット
if( is_front_page() && is_home() && !is_mobile() && !is_paged() ){
?>
<div class="posts-list-upper-front-widget toc<?php echo $luxe['content_discrete'] === 'discrete' ? ' grid ' : ' '; ?>clearfix">
<?php
dynamic_sidebar( 'posts-list-upper-front' );
?>
</div><!--/.posts-list-upper-front-widget-->
<?php
}
// フロントページ用のウィジェット（モバイル）
elseif( is_mobile() && is_front_page() && is_home() && !is_paged() ){
?>
<div class="posts-list-upper-front-widget-mob toc<?php echo $luxe['content_discrete'] === 'discrete' ? ' grid ' : ' '; ?>clearfix">
<?php
dynamic_sidebar( 'posts-list-upper-front-mob' );
?>
</div><!--/.posts-list-upper-front-widget-mob-->
<?php
}
// 記事一覧上部ウィジェット
if( is_active_sidebar('posts-list-upper') === true ) {
?>
<div class="posts-list-upper-widget toc<?php echo $luxe['content_discrete'] === 'discrete' ? ' grid ' : ' '; ?>clearfix">
<?php
dynamic_sidebar( 'posts-list-upper' );
?>
</div><!--/.posts-list-upper-widget-->
<?php
}Luxeritas（親テーマ）のlist-grid.phpの「// 記事一覧上部ウィジェット」の上辺りに色の変った部分のコードを貼り付ける。クラスとかLuxeritas独自のコード？はわけわからんので「// 記事一覧上部ウィジェット」のをコピペ。５行目と１５行目でそれぞれＰＣかモバイルか、フロントページか、１ページ目かと条件でわけている。
あまり親テーマをいじるとテーマがバージョンアップした時にいちいち直さなければいけないし、何より折角高速化を考えてのコードが書かれているのに素人が不細工なコードを迂闊に追加するとテーマが台無しになる恐れがあるので、あまり親テーマをいじりたくないのだがこの方法しか考え付かないダメな俺であった。
うまくいくとフロントページの「記事一覧上部ウィジェット」の上に「フロントページ用のウィジェット」が表示されるはず。このサイトではまだ記事数が少なくて２ページまでいってないが（苦笑）、他のサイトで同じウィジェットエリアを追加すると２ページ以降には表示されていなくて、思ったとおりの挙動になってめでたしめでたし。