Luxeritas（ルクセリタス）記事一覧１ページ目のみウィジェット表示する方法

2021年9月25日

Luxeritasではウィジェットをヘッダー下や記事一覧ページ上などに表示することができます。

でもこれって『記事一覧の２ページ目以降の表示は邪魔じゃない？』ということで１ページ目のみに表示させる方法を紹介します。

記事一覧２ページ以降でウィジェット非表示とするメリット

Luxeritasの記事一覧ページには、次のウィジェットエリア（赤枠部）があります。
（サイドバーのウィジェットエリアは省略しています）

デフォルトではどのウィジェットエリアも、記事一覧ページの2ページ目以降も表示されます。

もちろんこのままでもよいのですが、ページ上部となるヘッダー下ウィジェットエリアや記事一覧上ウィジェットには、２ページ目以降には不要なコンテンツを配置することがあるでしょう。

例えば、Luxeritasでカテゴリー記事一覧を表示する方法で紹介したように、記事一覧上にカテゴリー別記事を表示する場合などです。

このカテゴリー別記事は２ページ目以降を閲覧したいユーザーにとってはむしろ邪魔ですよね。したがって２ページ目以降は非表示にしたいと思います。

条件分岐タグで２ページ目以降はウィジェット非表示とする

非表示にするために、記事一覧２ページ目以降を判別する次の条件分岐タグ を使います。
（ワードプレスのCodex日本語版参照）

is_paged( )

この関数は２ページ目以降であればtrue、１ページ目であればfalseを返します。したがってif文を使って、

if( is_paged( ) === false ){（ウィジェットを表示）};

とすれば２ページ目以降は（ウィジェットを表示）が実行されないというわけですね。

手順概要

子テーマに必要なテンプレートファイルをコピーしてから編集していきます。

基本手順としては次の２ステップのみです。

1. 必要なテンプレートファイルを親テーマから子テーマにコピーする
2. 子テーマのテンプレートファイルを編集して保存
   （is_paged( )タグを挿入します）

このように手順としては単純なのですが、必要なテンプレートファイルがどれで、ウィジェット表示がどこに記述されているかを探すのが面倒なところです。

Luxeritasのテーマディレクトリ

テンプレートファイルはテーマディレクトリに格納されています。Luxeriatsのテーマディレクトリは以下の通りです。

• 親テーマ・・・（ワードプレスをインストールしたルート）＞wp-content＞themes＞luxeritas
• 子テーマ・・・（ワードプレスをインストールしたルート）＞wp-content＞themes＞luxech

サーバー内の親テーマや子テーマのディレクトリにアクセスするにはFileZillaなどのFTPソフトが必要です。準備しておきましょう。

詳細手順

ヘッダー下ウィジェットエリアの場合

①header.phpを親テーマから子テーマにコピーする

親テーマのディレクトリLuxeritasの中のheader.phpをコピーして子テーマディレクトリluxechにペーストします。

②子テーマのテンプレートファイルを編集して保存

１．子テーマのheader.phpにアクセス

ダッシュボードメニューの外観＞テーマエディターと進めて子テーマのheader.phpを開けます。

①テーマエディターの右サイドメニューの中からheader.phpをクリック
②子テーマのheader.phpが表示されることを確認

２．ヘッダー下ウィジェットエリアの記述箇所を確認

一番下までスクロールしていくと、350行目あたりにヘッダー下ウィジェットエリアの記述箇所が見つかります。

シンタックスハイライターでコードを明示しておきます。

if( function_exists('dynamic_sidebar') === true ) {
	if( isset( $luxe['amp'] ) && is_active_sidebar('head-under-amp') === true ) {
		$amp_widget = thk_amp_dynamic_sidebar( 'head-under-amp' );
		if( !empty( $amp_widget ) ) echo $amp_widget;
	}
	elseif( !isset( $luxe['amp'] ) && is_active_sidebar('head-under') === true ) {
		dynamic_sidebar( 'head-under' );
	}
}

３．ヘッダー下ウィジェットエリアのコードを編集して保存

次のようにコードを編集します。350行目にコメント文も追記しましたが、これは任意です。

if文の中に&& is_paged( ) === false を記述することで、２ページ目以降にはこのウィジェットエリアが表示されなくなります。コードは全て半角で記述してください。

//ヘッダー下ウィジェット表示（1ページ目のみに表示する）	
if( function_exists('dynamic_sidebar') === true && is_paged() === false ) {
	if( isset( $luxe['amp'] ) && is_active_sidebar('head-under-amp') === true ) {
		$amp_widget = thk_amp_dynamic_sidebar( 'head-under-amp' );
		if( !empty( $amp_widget ) ) echo $amp_widget;
	}
	elseif( !isset( $luxe['amp'] ) && is_active_sidebar('head-under') === true ) {
		dynamic_sidebar( 'head-under' );
	}
}

最後に画面下の”ファイルの更新”をクリックして保存しましょう。

記事一覧上ウィジェットエリアの場合

①loop.phpまたはloop-grid.phpを親テーマから子テーマにコピーする

Luxeritasの記事一覧表を表示するループ文（メインループ）は、loop.phpとloop-grid.phpの2通りあります。

• loop.php ・・・・・通常スタイルの記事一覧表を表示する
• loop-grid.php・・・タイル型またはカード型の記事一覧表を表示する

したがって、自分が使っている一覧表の外観によりどちらかを選んで子テーマにコピーしてください。
（面倒でなければ両方コピーするのがよいでしょう）

②子テーマのテンプレートファイルを編集して保存

１．子テーマのloop.phpまたはloop-grid.phpにアクセス

ダッシュボードメニュー　外観＞テーマエディター　と進めて、子テーマのloop.phpまたはloop-grid.phpを開けます。

（loop.phpの場合）
①画面右メニューのloop.phpをクリック
②子テーマのloop.phpであることを確認

（loop-grid.phpの場合）
①画面右メニューのloop-grid.phpをクリック
②子テーマのloop-grid.phpであることを確認

２．記事一覧上ウィジェットエリアの記述箇所を確認

loop.php、loop-grid.phpそれぞれの記事一覧上ウィジェットエリアの記述箇所は次の通りです。

いずれもコメント文で”記事一覧上部ウィジェット”と記述があるのでわかりやすいです。

（loop.phpの記述箇所）

（loop-grid.phpの記述箇所）

記述しているコードの内容は、loop.php、loop-grid.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
}

３．記事一覧上ウィジェットエリアのコードを編集して保存

loop.php、loop-grid.phpともにコードの編集内容は同じなので、loop-grid.phpは省略します。

ヘッダー下ウィジェットエリアの場合と同じく、if文の中に&& is_paged( ) === false を記述することで、２ページ目以降にはこのウィジェットエリアが表示されなくなります。コードは全て半角で記述してください。

// 記事一覧上部ウィジェット（１ページ目のみに表示）
if( is_active_sidebar('posts-list-upper') === true && is_paged() === false ) {
?>
<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
}

最後に画面下の”ファイルの更新”をクリックして保存しましょう。

以上で終了です。２ページ目以降にはウィジェットが表示されなくなります。

まとめ

今回はヘッダー下と記事一覧上の２つのウィジェットを２ページ目以降非表示としましたが、同じ考え方で次のコードを記述すれば他のウィジェットエリアにも適用することができます。

if( is_paged( ) === false ){（ウィジェットを表示）};

なおテンプレートファイルを編集する方法以外に、functions.phpにunregister_sidebar( )関数を記述してウィジェットを登録取り消す方法もあります。確かにウィジェット自体は非表示となるのですが、ウィジェットエリアがアクティブと判断されてウィジェットのコンテナである<div>タグが表示されてしまうため採用を断念しました。