【WordPress】固定ページにカテゴリ・タグ一覧や人気記事を出力するプラグイン「Page Builder by SiteOrigin」

Pocket

のブログはWordPressで作られていますが、レスポンシブデザインのため、サイドバーに表示しているウィジェットは、タブレットなど画面の小さな機器で閲覧すると見えなくなってしまいます。

すると、サイドバーにあるプロフィールや、カテゴリリストを表示したツリー、人気記事のランキングが目につかなくなってしまい、ユーザビリティが失われてしまいます。

image1

image7

それを防ぐために考えたのが、タブレットから見ても表示されるメニューバーにそれらの情報を載せたページへのリンクを表示することです。

 image2

これを実現するためには、プロフィール、カテゴリ一覧、人気記事ランキングを表示する単一ページを作る必要があります。

プロフィールを説明したページを作るのは簡単ですが、カテゴリ一覧や人気記事を表示するのは一筋縄ではいきません。

それを可能にするプラグインが「Page Builder by SiteOrigin」です。

Page Builder by SiteOriginの使い方

Page Builder by SiteOriginは、投稿・固定ページにウィジェットを挿入したり、記事にカラムを作って、2列、3列の文章を書いたりすることのできるプラグインです。

固定ページにギャラリーを作ったり、新着記事を表示したりすることもできます。ウィジェットとして利用できるプラグインをインストールしていれば、それぞれの機能を使えるので、利用の仕方はさまざまです。

Page Builder by SiteOriginの使い方については、こちらのページを参考にさせていただきました。

投稿、固定ページ内にウィジェットを挿入 | Plus WordPress はてなブックマーク - 投稿、固定ページ内にウィジェットを挿入 | Plus WordPress

WordPressでもっと手軽に美しい記事を書こう! | Design Report – デザインレポート はてなブックマーク - WordPressでもっと手軽に美しい記事を書こう! | Design Report – デザインレポート

「Page Builder by SiteOrigin」の使い方 | Design Report – デザインレポート はてなブックマーク - 「Page Builder by SiteOrigin」の使い方 | Design Report – デザインレポート

これを使うと、新規ページや新規投稿を作成する際、次のようなタブが出てきます。

 image3

次にウィジェットを追加するボタンを押せば、現在自分のWordPress内で使えるウィジェットの一覧が出てきます。

 image4

ここでカテゴリリスト用のウィジェットや、タグ一覧のウィジェット、人気記事用のウィジェットを選択すれば、固定ページにそれらの情報を出力することがてきます。

image5

カテゴリリスト用のウィジェットはもともとWordPressに標準装備されていますが、詳細な設定(一部のカテゴリだけ表示し、除外するカテゴリを選ぶなど)をしたいなら、My Category Orderなどのプラグインをインストールしてください。

人気記事を出力するにはWordPress Popular Postsや、Jetpackなどのプラグインをあらかじめ別途インストールしておいてください。

使いたいウィジェットを選択すると以下のような画面になります。

image6

ウィジェット名をクリックすると、サイドバーにウィジェットを追加するときと同様に詳細な設定をすることができます。

保存して公開すると、以下のような固定ページが完成します。

カテゴリ一覧 人気記事

これらのページにさきほどのメニューバーからリンクを貼れば、完成です。

タブレットから閲覧して、レスポンシブデザインのためサイドバーがなかったとしても、メニューバーからカテゴリリストや人気記事のページにワンクリックでたどり着くことができます。

ユーザビリティ向上のためにぜひお試しください。

スポンサーリンク
Pocket

▼こちらの記事もおすすめです


スポンサーリンク