ページ（記事）を分割表示させる方法 [wordpress]
cssで見栄えをよくする
これは大分迷いました。というのは２ページ目以降はリンクが貼られるので問題ないのですが
ランクを貼られていない当ページのソースをみるとただの”１”とでてるだけ・・
色々調べ 試して失敗して その結果下記の様なスタイルにたどり着きました。
[php]<!–?php wp_link_pages(‘before=
<div id="nextpage">&after=</div>
&next_or_number=number&pagelink=<span>Page %</span>’); ?>[/php]
上のタグの説明をしますと 呼び出したページナビの前後に入れるソース（beforeとafter）を足してページナビに属性を付けます。
Page %は Pageが数字の前にくる文字。%が数字になります。変更する場合はPageの所（%はそのまま）を変更します。
そしてページナンバーの前後にspanを付けました。 ＜li＞でも試してみましたがうまくいきませんでした・・
さて、spanで括られた数字ですが リンクの貼られた２ページ目以降は下記の様なソースになってしまいます。
[php]<a href="https://www.d-31n.com/blog/wp-plugin/1976/2/"><span>Page 2</span></a>[/php]
リンクタグの間にspanが入ってしまいますので CSSで設定するときも span a などでなく a spanとなります。
下記はこのブログで設定しているCSSです。参考にしてみてください。
[css]div#nextpage {
font-size: 100%;
clear:both;
}
div#nextpage span {
background-color:#e9e8e8;
padding: 0.5em 1em;
margin: 0.25em;
text-decoration: none;
border: 1px solid #666666;
color: #333;
}
#nextpage a span, #nextpage a:link span {
padding: 0.5em 1em;
margin: 0.25em;
text-decoration: none;
background-color:#bbe0e5;
border: 1px solid #00b8fd;
color: #999999;
}
#nextpage a:visited span {
border: 1px solid #8f9da6;
color: #999999;
}
#nextpage a:hover span {
background-color:#45bcd2;
text-decoration: underline;
border: 1px solid #0198ca;
color: #ffffff;
}
[/css]
