vicuna CMS テーマの修正 (wp_link_pages()関数の追加)

今回のvicuna CMS – WordPress Theme Ext. Custom (以下 vicuna とします)の修正はwp_link_pages()関数の追加についてです。

wp_link_pages()関数は1つの投稿記事を複数のページに分割した際、分割したページそれぞれへのリンクを自動的に記述してくれるコードです。このコードをテーマに入れておけば、記事を分割したい場合に投稿内容の分割したいところで次のタグを入れておくだけです。主にpage.phpファイルとsingle.phpファイルにコードを記述して使います。

< !-- nextpage -->

(このコードの詳細はいつものごとく、関数に関する詳細は WordPress Codex または WordPress Codex日本語版 、グーグル先生を参考にしてください 😛 )

さて、実際にコードに埋め込むにはpage.phpファイルやsingle.phpなどの記事を単体で表示する際に呼ばれるファイルに記述します。私の場合、記事を表示させたすぐ下にリンクを表示させたかったので次のように記述しました。

<div class="textBody">
< ?php
	the_content(__('Continue reading', 'vicuna'));
	wp_link_pages( 'before=<div class="page-link">&after=</div>&pagelink=<span class="page-numbers">%</span>' );	// < -- add
?>

wp_link_pages()関数は引数によって出力される分割ページへのリンクのHTMLタグを変更できます。引数を指定することによって出力されるHTMLコードはこんな感じ。架空の投稿ページのURLを https://shinonon-web.net/wordpress/exp-page/ とした場合を想定したコードです。

<div class="page-link">
	<span class="page-numbers">1</span>
	<a href="https://shinonon-web.net/wordpress/exp-page/2/">
		<span class="page-numbers">2</span>
	</a>
	<a href="https://shinonon-web.net/wordpress/exp-page/3/">
		<span class="page-numbers">3</span>
	</a>
</div>

後は使っているデザインに合わせてCSSファイルにスタイルを記述するだけです。

今回のコードの修正は簡単。鬱陶しいのは使用しているテーマに合わせてスタイルを指定することだと思います。いちいち確認しながら指定しなきゃいけませんからね 😆

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です