カテゴリーやアーカイブページなどに前後のページへのリンクを追加 | VPSサーバーでWebサイト公開　備忘録　~Linux、MySQLからAJAXまで

アーカイブページやカテゴリーページでは、１アーカイブ（1ヵ月分）や１カテゴリー内に複数の投稿がありますが、１ページに表示できる投稿数は設定で最大値が決められています。この最大値を超える投稿数がある場合は、前後のページへのリンクが無いと表示する事ができません。
　
手動で前後のページへのリンクを追加する手順を備忘として残しました。
ここでは、twentytwelveの設定内容を参考にして設定しています。

※目次をクリックすると目次の下部にコンテンツが表示されます。

１．twentytwelveの設定内容の確認
２．自分のテーマに前後のリンクを設定
３．設定確認

twentytwelveの設定内容の確認

①前後のリンクを表示する関数（previous_posts_link、next_posts_link）がテーマフォルダ内のどのテンプレートファイルで使用されているか確認
　
確認例）

# cd themes/twentytwelve/
# grep previous_posts_link ./*
./functions.php:                        <div class="nav-next alignright"><?php previous_posts_link( __( 'Newer posts <span class="meta-nav">→</span>', 'twentytwelve' ) ); ?></div>

　
②functions.php内のどの関数で定義されているか確認
　
確認例）
function twentytwelve_content_nav( $html_id )
で定義されていました。
　
③twentytwelve_content_nav関数がどのテンプレートファイル内で設定されているか確認
　
（確認例）

# grep twentytwelve_content_nav ./*
./archive.php:                  twentytwelve_content_nav( 'nav-below' );
./author.php:                   <?php twentytwelve_content_nav( 'nav-above' ); ?>
./author.php:                   <?php twentytwelve_content_nav( 'nav-below' ); ?>
./category.php:                 twentytwelve_content_nav( 'nav-below' );
./functions.php:if ( ! function_exists( 'twentytwelve_content_nav' ) ) :
./functions.php:function twentytwelve_content_nav( $html_id ) {
./index.php:                    <?php twentytwelve_content_nav( 'nav-below' ); ?>
./search.php:                   <?php twentytwelve_content_nav( 'nav-above' ); ?>
./search.php:                   <?php twentytwelve_content_nav( 'nav-below' ); ?>
./tag.php:                      twentytwelve_content_nav( 'nav-below' );

　
④twentytwelve_content_nav関数が各テンプレートファイル内のどの場所で設定されているか確認
　
（確認例）
○twentytwelve_content_nav( ‘nav-below’ )の場合
　
いずれのテンプレートファイルでも下記のように投稿ループ内のendwhileの直後に設定されていました。

<?php
/* Start the Loop */
while ( have_posts() ) : the_post();
　：
　：
endwhile;
twentytwelve_content_nav( 'nav-below' );
?>
　
<?php else : ?>
 <?php get_template_part( 'content', 'none' ); ?>
<?php endif; ?>

　
○search.phpのtwentytwelve_content_nav( ‘nav-above’ )の場合
　
下記のようにヘッダーと投稿ループ開始の間に設定されていました。

</header>
　
<?php twentytwelve_content_nav( 'nav-above' ); ?>
　
<?php /* Start the Loop */ ?>
<?php while ( have_posts() ) : the_post(); ?>

自分のテーマに前後のリンクを設定

①twentytwelve_content_navを修正
　
試しに設定してみたところ、前後のリンクのテキストが、”Older posts”と”Newer posts”と日本語に翻訳されない状態で表示されていました。
　
直し方が分からなかったので、直接日本語を記述しました。
　
（設定例）

if ( ! function_exists( 'twentytwelve_content_nav' ) ) :
function twentytwelve_content_nav( $html_id ) {
  global $wp_query;

  $html_id = esc_attr( $html_id );

  if ( $wp_query->max_num_pages > 1 ) : ?>
    <nav id="<?php echo $html_id; ?>" class="navigation" role="navigation">
      <h3 class="assistive-text"><?php _e( 'Post navigation','twentytwelve' ); ?></h3>
      <div class="nav-previous alignleft"><?php next_posts_link( '<span class="meta-nav">←</span> 次のページへ' ); ?></div>
      <div class="nav-next alignright"><?php previous_posts_link( '前のページへ <span class="meta-nav">→</span>' );?></div>
    </nav><!-- #<?php echo $html_id; ?> .navigation -->
  <?php endif;
}
endif;

　
②上記①のコードをfunctions.phpにコピー
　
③twentytwelve_content_nav( ‘nav-below’ )関数を下記テンプレートファイルに設定
　
archive.php、search.php
　
※author.php、category.php、tag.phpは、私が使用しているテーマにはありませんでした。
index.phpには設定する場所がありませんでした。
　
下記のように、投稿ループのendwhileの直後に設定しました。
<?php endwhile; ?>
<?php twentytwelve_content_nav( ‘nav-below’ ); ?>
<?php else : ?>
　
④twentytwelve_content_nav( ‘nav-above’ )関数をsearch.phpに設定
　
下記のように投稿ループの開始直前に設定
<?php twentytwelve_content_nav( ‘nav-above’ ); ?>
<?php while (have_posts()) : the_post(); ?>

設定確認

月別アーカイブ、カテゴリー、検索結果ページで前後のページへのリンクが表示できるようになりました。

関連記事の目次

WordPressテーマ作成

コメントを残す コメントをキャンセル

コメントを残すコメントをキャンセル