ワードプレスで各カテゴリーページの先頭に固定表示

ワードプレスで各カテゴリーページの先頭に固定表示

  • 2017-12-16  最終更新日:2017-12-16

ワードプレスの先頭に固定表示機能は便利で特定の記事を固定しておく場合にはとても便利です。この機能って基本的にトップページにしか反映されないのでカテゴリーページにも対応できたらと思い設置してみました。

割とプラグインで対応するようなケースが多いですが今回はcategory.phpに書き込んで完了です。


設置方法

category.phpに以下のように記載します。

category.php

<!-- 先頭固定表示 -->
<?php if (!is_paged()) : ?>
<?php $sticky = get_option('sticky_posts');
	if(!empty($sticky)):
		$get_cat = get_the_category();
		$cat = $get_cat[0];
		$args = [
			'posts_per_page' => 1,
			'cat' => $cat->cat_ID,
			'post__in'  => get_option('sticky_posts'),
		];

		$the_query = new WP_Query( $args );
		if ( $the_query->have_posts() ) :
			while ( $the_query->have_posts() ) : $the_query->the_post();?>
			<h2><?php the_title(); ?></h2>
			<p><?php the_content(); ?></p>
			<?php endwhile;?>
		<?php endif;?>
		<?php wp_reset_postdata(); ?>
	<?php endif;?>
<?php endif;?>
<!-- カテゴリー表示 -->
<?php
$get_cat = get_the_category();
$cat = $get_cat[0];
$args = [
	'post__not_in' => get_option('sticky_posts'),
	'cat' => $cat->cat_ID,
];
	$the_query = new WP_Query( $args );
	if ( $the_query->have_posts() ) : ?>

		<?php the_archive_title( '<h2 class="page-title">', '</h2>' );
				the_archive_description( '<div class="archive-description">', '</div>' );?>
		<?php while ( $the_query->have_posts() ) : $the_query->the_post();?>
			<?php the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' ); ?>
			<?php the_excerpt(); ?>
	<?php endwhile;endif;?>

先頭固定ページは1件のみ取得してカテゴリーの一番上に表示します。

!is_paged()で2ページ以降は先頭固定表示しないようにします。

get_option(‘sticky_posts’)で一番最初の先頭固定表示の投稿を取得します。カテゴリーページなのでget_the_category()で現在のカテゴリーを取得、posts_per_pageで1件取得、post__inで投稿IDで表示を指定します。これで一番上に固定表示されます。

それ以下は通常のカテゴリー表示ですが’post__not_in’ => get_option(‘sticky_posts’)で先頭固定表示を取得しないようにしてあとはループして表示させれば良いですね。

参考になれば幸いです。


∞Tadashi Suyama∞

wordpress category カテゴリ 先頭固定表示
  • このエントリーをはてなブックマークに追加
  • follow us in feedly

サイト内検索

最近の投稿

アイキャッチ
そろそろvuejs始める

最近はjQueryよりvueで書いた方が楽ではないかと思い学習中です。 そもそもVuejsはドキュメントが日本語対応なので試しやすいし情報も豊富なので学習しやすいです。 3大フレームワークと呼...

02 May 2021

アイキャッチ
追い風CSS(tailwindcss)が結局楽かも

最初にtailwindcssのv1が出た頃はまだbootstrapで良いかな。 htmlに入れるクラスタグが多過ぎと思っていました。あまり良い印象はなかったです。 時は過ぎいろいろと触っていると...

29 Apr 2021

アイキャッチ
エラー処理について

COJPドメンを取得する際に「登記年月日」という項目があります。 その項目通り登記した年月日を入れる訳ですが、なぜかエラーが出ました。 半角英数字にして下さいというよくあるエラーです。当然半角英...

24 Jan 2021

アイキャッチ
javascriptのundefinedの判定

jqueryで高さの数値をとって足し算をしていたらエラーも出ずに動かないということになったので調べてみました。 ワードプレスで管理画面のアドミンバーが一度ログインするとフロント画面でも表示される...

17 Jan 2021

アイキャッチ
Webpack5にアップデートしてエラーの対処方法2つ

webpack4(4.41.5)から webpack5(5.12.1)にあげました。 特に難しい設定は行っておらず主にscssと共通モジュールの設定だけで使っているのですがそれでもエラーが出たの...

09 Jan 2021

著者

ウェブエンジニアの須山のブログです。

WEBに関することや個人的に関心のあることについて書きます。主に技術系ブログです。

フッターイメージ