WordPressデフォルトテーマのTwentyTwelveやTwentyElevenのトップページやカテゴリーページの下にある、「←過去の投稿」「新しい投稿→」というページネーションが、とてもイケテナイと思う@web_shufuです。そこで、カスタマイズ方法を調べてみました。
（注）以下の内容は、TwentyTwelveをカスタマイズする前提で書かれています。TwentyElevenをカスタマイズする場合は、TwentyTwelveをTwentyElevenに置き換えるなど、多少応用してください。
ページネーションとは
この記事でいうページナビゲーションは、トップページやカテゴリーページなどでページ分割を行った場合の、次のページや他のページへのリンクのことです。
グーグル検索の下にある前へ 1 2 3 4 5 6 7 8 9 10 次へというようなリンクや、「←過去の投稿」「新しい投稿→」リンクもページナビゲーションです。
ページナビゲーションを担当する関数
TwentyTwelveテーマで、「←過去の投稿」「新しい投稿→」リンクを出力しているのは、twentytwelve_content_nav関数です。
トップページやカテゴリーページにあるtwentytwelve_content_nav( ‘nav-below’ );が、こんな作業（function.phpで規定されている)をして
if ( ! function_exists( 'twentytwelve_content_nav' ) ) :
/**
* Displays navigation to next/previous pages when applicable.
*
* @since Twenty Twelve 1.0
*/
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> Older posts', 'twentytwelve' ) ); ?></div>
<div class="nav-next alignright"><?php previous_posts_link( __( 'Newer posts <span class="meta-nav">→</span>', 'twentytwelve' ) ); ?></div>
</nav><!-- #<?php echo $html_id; ?> .navigation -->
<?php endif;
}
endif;
?>
その結果、こんなhtmlソースを出力して
<nav id="nav-below" class="navigation" role="navigation">
<h3 class="assistive-text">投稿ナビゲーション</h3>
<div class="nav-previous alignleft"><a href="http://www.example.com/tonyo/page/3/"><span class="meta-nav">←</span> 過去の投稿</a></div>
<div class="nav-next alignright"><a href="http://www.example.com/tonyo/">新しい投稿 <span class="meta-nav">→</span></a></div>
</nav><!-- #nav-below .navigation -->
こんな表示をしてくれてます。
twentytwelve_content_navは除去すべし
このように、twentytwelve_content_navはページナビゲーションを一手に引き受けて頑張ってくれる関数です。
しかし、これをカスタマイズするとなると、category.phpやindex.phpではなく、function.phpをいじらないといけません。
また、function.phpでは、翻訳関数の_e関数と__関数がかなりたくさん使われているので、WordpressやPHPにある程度慣れないと、とてもカスタマイズしにくいです。
そこで、twentytwelve_content_nav( ‘nav-below’ );は削除してしまい、デフォルトとは全く異なるページナビゲーションを導入するほうがカスタマイズしやすいと思います。
プラグインでカスタマイズ
「デフォルトとは全く異なるページナビゲーションを導入する」方法として、最も手軽なのがプラグインです。
私のオススメはWP-PageNaviとWP PageNavi Styleです。
導入にあたってはこちらを参考にしてください。
[img-link url=”http://www.seotemplate.biz/blog/wordpress-plug/10904/” title=”WordPressのページ送り用プラグイン – WP PageNavi Styleの使い方 | WP SEOブログ”]
ちなみに、WP SEOブログさんは、他にも役立つ記事満載ですので、一度チェックすることをオススメします。
スニペットをコピペする
WordPressやPHPに多少慣れているなら、プラグインよりスニペットのコピペがオススメです。
以下の記事がとてもよくまとまっています。
[img-link url=”http://coliss.com/articles/blog/wordpress/how-to-build-a-wordpress-post-pagination-without-plugin.html” title=” WordPressにプラグイン無しでページネーションを設置する方法 | コリス”]
デフォルトのページナビゲーションの文言だけを変えたい場合
デフォルトのページナビゲーションの文言だけを変えたい場合は、
twentytwelve_content_nav( ‘nav-below’ );
があった場所に、以下の部分を貼り付けてください。すると、デフォルトのページナビゲーションが復活します。
global $wp_query;
if ( $wp_query->max_num_pages> 1 ) : ?>
<nav id="nav-below" class="navigation" role="navigation">
<h3 class="assistive-text">投稿ナビゲーション</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><!-- #nav-below .navigation -->
<?php endif;
あとは、日本語の部分とか、→を自分の好きな言葉に変えればカスタマイズできます。