ページ送り部分に手を加えてみた

今日はページの下の方にある「ページ送り部分」に手を加えてみた。

Cocoonのデザインは非常にシンプルだがやはりカラーなどを合わせた方が統一感がある。

▼今回参考にさせて頂いたサイト様はこちら

【Cocoon】ページネーション(ページ送り)をカスタマイズ
WordPressテーマ「Cocoon」のカスタマイズ備忘録です。今回はページネーションのカスタマイズです。ページネーション(ページ送り)というのは、記事一覧の下にあるこういうやつですね↓「Cocoonっぽさ」がある部分なので、ここを変える

 

まずはビフォーの状態。

≪before≫

ページ送り(改造前)

 

シンプルな点も良いのだが、レスポンシブ対応した際にこのままのデザインで遜色ないのが良い。

今回はここに、

  1. テーマカラーを加える
  2. 「次のページ」ボタンと「 〉」が重複しているので「次のページ」ボタンを消す

を行ってみた。

 

≪after≫

ページ送り(改造後)

 

うん!すばらしい!

今回は上記リンクの参考サイト様のコードほとんどそのままで対応可能だった。

当サイトでは行わないがボタンを丸くしたり動きをつけたりなんかも簡単にできると思う。

ページ送りは比較的手を加えやすい部分だと思う。

 

 

タイトルとURLをコピーしました