ベストセラー人気 WordPress テーマTop 30 詳細

Diviテーマで数字のページネーションナビゲーションを使用する

Last Updated:2023年1月2日| | コメントを残す

エレガント Themesの Diviテーマでブログモジュールや、最新の記事、カテゴリ、などの改ページが次の図のように "過去の入力点""次のエントリ"のように表示されます。

Diviのメインページネーション
Diviのメインページネーションナビゲーション

あまり好きなページ番号(Pagination)形式ではありませんね。 このページネーション形式を数値に置き換えたい場合は、コードを直接作成して追加したり、プラグインを使用したりできます。

以下は、Diviテーマだけでなく他のテーマにも適用できます。 Newspaperのようなテーマでは、独自にページネーションを提供することもあります。

WP-PageNaviプラグインを使用してページ数ナビを使用する

最も簡単な方法は、 WP-PageNavi プラグインを使用することです。 (他にも WP-Paginate など、いくつかのプラグインがあります。)

WordPress ページネーションプラグイン

このプラグインをインストールした後に WordPress 管理者ページの 設定> PageNaviのオプションを指定することができます。

PageNavi設定
PageNavi Settingsページ

必要に応じて設定をするようにします。 必要に応じてハングルで変更できます。 そしてCSSでレイアウトを必要に応じて変更することができます。

たとえば、 "Style The WordPress WP-PageNavi Post Navigation Plugin"文で紹介されたCSSコードを使用すると、次のように改ページを表示バーが表示されます。

WordPress WP-Pageナビゲーションプラグイン
WordPress WP-Pageナビゲーションプラグイン。

参考までに Blog Module(ブログモジュール)で改ページをナビゲーションを表示するには、 Show Pagination オプションを Yes に設定します。

Diviテーマのブログモジュールの設定

ユーザーコードを使用してページ数ナビで置換

外部のテーマを使用する代わりに、直接コードでページネーションシンボルを挿入するには、テーマファイルを変更する必要があります。 たとえば、文の表示形式を、最新のグローバル表示するように設定(設定>読むで "フロントページの表示"を"最新記事"として指定)し、次のコードを関数ファイルに追加するようにします。(必ずチャイルドテーマを作成した後の操作にします。)

function pagination_bar() { global $wp_query; $total_pages = $wp_query->max_num_pages; if($ total_pages> 1){$current_page = max(1、get_query_var( 'paged')); echo paginate_links(array( 'base' => get_pagenum_link(1) . '%_%', 'format' => '/page/%#%', 'current' => $current_page, 'total' => $total_pages 、)); } } // Source: エレガント Themes

その後、次のコードをループが終わる直前(「endif」ステートメントの後に、しかし「endwhile "の前に)に追加するようにします。


</nav

それでは前へ、次の記事のリンクの代わりに、次の図のようなページ数のナビゲーションが表示されます。

WordPress ページ数ナビ
WordPress ページ数ナビ

CSSを使用して、レイアウトスタイルを適切に調整するようにします。

このブログでは、現在 Diviテーマを使用しているが、グィチァニズムためだけの基本ページネーションナビゲーションを使用しています。 (簡単に行くWP-PageNaviプラグインをインストールすればよいが、今でも非常に多くのプラグインがインストールされており、追加のプラグインをインストールすることが負担になってなるべくプラグインのインストールを自制しています。)

メモ:


コメントを残す

コメント

?

WordPress Naver カフェを訪れる

ありがとうございます!