Lightning のアーカイブページでページ送りをループの上にも追加する方法

,

  1. Staff Blog
  2. WordPress
  3. Lightning のアーカイブページでページ送りをループの上にも追加する方法

アクションアクションフックを使って挿入

もしページネーションをループの上部に表示したい場合はアクションフックで挿入します。

子テーマの functions.php などに以下を追加します。

 add_action( 'lightning_loop_before', function(){
	// 投稿タイプが post の時に改変
	if ( 'post'	== get_post_type() ){
		$args = array(
			'mid_size'           => 1,
			'prev_text'          => '«',
			'next_text'          => '»',
			'type'               => 'list',
			'before_page_number' => '<span class="meta-nav screen-reader-text">' . __( 'Page', 'lightning' ) . ' </span>',
		);
		// もしループ下部のページ送り部分をフィルターフックで改変している場合は、同様の改変が効くように下記も必要
		$args = apply_filters( 'lightning_pagenation_array', $args );
		// ページネーションを表示
		the_posts_pagination( $args );
	}
 });

子テーマについて不明な場合はこちらの記事 を参照ください。

アクションフックについてはこちらの記事 を参照ください。

CSSで調整

普通に追加しただけだと余白の具合がよろしくないと思うので、外観 > カスタマイズ > 追加 CSSなどに調整するCSSを記載してください。

// 最初のナビゲーションの上下余白調整
.main-section .pagination:first-child{
    margin-top:0;
    margin-bottom:20px;
}

CSSでのカスタマイズについてはこちらの記事 を参照ください。

この記事を書いた人

石川栄和代表取締役
名古屋のウェブ制作会社数社に10年程度務めた後、株式会社ベクトル設立。
企画・運営・コンサルティング〜WordPressを中心としたシステム開発まで幅広く携わる。
[ 著書 ]
・いちばんやさしいWordPressの教本(共著)
・現場でかならず使われているWordPressデザインのメソッド(共著)
[ 最近のWordPressコミュニティでの活動 ]
WordCamp Tokoy 2023 セッションスピーカー
WordCamp Asia 2023 セッションスピーカー(LT)
WordCamp Niigata 2019 セッションスピーカー
WordCamp Haneda 2019 セッションスピーカー
WordCamp Osaka 2018 セッションスピーカー
WordCamp Kyoto 2017 セッションスピーカー

ご好評につきキャンペーン期間延長!
Vektor Passport


を買って

Evergreen
無料でダウンロードしよう

Lightningで使えるおしゃれなデザインスキン / コンテンツデータを試せるチャンス!


PAGE TOP

このデモサイトは Vektor,Inc. のテーマとプラグインで構築されています。ご購入や詳細情報は下記のリンクもご参考ください。