ちなみにGoogleに推奨される方法ではないらしい。
ただ既存のテーマを使っていると結構定義とか入れ子になっていたりしてどのファイルを編集すればいいのかわからなかったので直接編集することにした。
他のテーマであればもっとわかりやすいとかあるのかもしれない。
style.css が大きくて編集しようにも時間がかかってしまいそうだったのであきらめた。
scss だのなんだのとみてみたけど結局どの部分を編集すれば変わるのかわからなかった。
WordPress ではページングが用意されている関数で実装できる。
その際にページングの要素にタグ付けやクラスの名前が付けられているのでそれを利用して
外観 → テーマ → 追加CSS
のところに以下の CSS を入れた。
.pager > li >
a.page-numbers{
color:#000000;
background-color:#ffffff;
}
.pager > li > span.page-numbers.current{
color:#ffffff;
background-color:#000000;
}Simple Bootstrap テーマの場合は .pager までは CSS が決まっているが .previous と .next しか指定されていなかったので自分で無理やり作った形になる。
今回はテーマに存在していなかったタグに対してつけているからいいかもしれないけど今後デザインが合わないとかでテーマにもともと定義されているタグを何回も上書きするのはよくなさそう。
そもそもテーマとしてページングが入っていなかったのでしょうがない。
今回自分がやったのは現在いるページのボタンを黒くするということだけ。
なんなら a.page-numbers はいらないかもしれない。
タグの調べかたはボタンのところで左クリックを押して検証する。
f12 キーとかで見るやつ。
そもそもページング自体テーマに入っていないことがあるのでそういうときには使える。