ここでは記事一覧ページを作成する事が出来るプラグイン、Content Viewsの使い方について説明していきます。
色々と細かいカスタマイズも出来ますし、PS Auto Sitemapの様にずっと更新されていないという事も無い。
初心者から上級者まですごくおススメのプラグインなので、記事一覧ページ作成に困っている方は是非参考にしてみて下さい。
ポイントをかいつまんで先にバシッと言っておきます！
- 記事一覧ページがあると読者に親切！
- Content Viewsなら簡単に記事一覧ページが出来る！
さっそく本文に入っていきますよ！
Content Viewsで簡単に記事一覧ページが作れる！
Content Viewsは記事一覧ページを簡単に作れるプラグインです。
記事の一覧を表示する為のショートコードを作成し、それを指定の場所に貼ればそれだけでOK。
こんな感じ↓の記事一覧を作成する事が可能なのです。
記事一覧を作るプラグインとしてはPS Auto Sitemapが有名ですが、もう何年も更新されておらずちょっと不安。
別のプラグインを探しても固定ページのみの対応だったりして、ニーズに合うプラグインが見つからない。
Content Viewsはそんな方にピッタリのプラグインなんですね。
Content Viewsの使い方【初心者はこれだけやればOK】
ここでは細かい設定は抜きにして、ちゃんとした記事一覧ページをサクッと作りたいという方の為に、投稿と固定ページを両方表示する記事一覧ページの作り方を解説していきます。
（細かい設定の詳細については次章をご参照ください）
①「プラグイン」→「新規追加」で「Content Views」と検索し、インストール＆有効化しましょう。
②メニューに「Content Views」が出来るので「新規追加」をクリックします。
③ショートコードの作成画面に遷移します。
Content Viewsでは
- 投稿の記事一覧ページのショートコード
- 固定ページの記事一覧ページのショートコード
を別々に作る必要があります。（できれば一つのショートコードで投稿と固定ページ、両方とも全ての記事を一覧で表示したいのですが、それが不可）
という事で、まず投稿の記事一覧のショートコードから作っていきましょう！
投稿の記事一覧のショートコード
という事で、「投稿」の記事一覧を表示するショートコードを作成していきます。
- Filter Settings
- Display Settings
の2つのタブがあり、両方設定していく必要があります。
以下、順番に説明していきますね！
Filter Settings
「Filter Settings」（①）を選択します。
②にショートコードのタイトルを入れますが、これは分かりやすいものを。
素直に「記事一覧ページ（投稿）」とかでOK。
Content Typeでは「投稿」を選択し（③）、CommonのLimitは空欄にしましょう。（④）
CommonのLimitは最初は「10」が入力されているので、それを消す形になります。
他はいじらなくてOKなので、一旦「保存」を押します。
Display Settings
「Display Settings」を選択し（①）、「Collapsible List」をチェック。（②）
「Show thumbnail on the left/right of text」にチェックを入れます。（③）
「Show Thumbnail」「Show Title」「Show Content」の3つにチェックを入れます。（④）
サムネイルのサイズは「Post Thmubnail（150×150）」（⑤）を選択。
内容では「Show Excerpt」を選択し、100Wordsと入力。（⑥）
（デフォルトでは20Wordsになってます）
⑦の「Allow HTML tags (a, br, strong, em, strike, i, ul, ol, li) in excerpt」にチェックを入れます。その下の文言はデフォルトの「続きを読む」でOK。
最後に⑧の「Current Tab」にチェックを入れて保存を押しましょう。
↓
すると画面の一番上に「投稿」の記事一覧を表示する為のショートコードが表示されます。
固定ページの記事一覧のショートコード
次に「固定ページ」の記事一覧のショートコードを作成していきます。
固定ページも
- Filter Settings
- Display Settings
の2つのタブがあり、それぞれ順番に設定してきます。
（「投稿」の時と違う箇所がちょっとだけありますが、大体同じです）
Filter Settings
「Filter Settings」（①）を選択します。
②にショートコードのタイトルを入れますが、これは分かりやすく「記事一覧ページ（固定ページ）」とかでOK。
Content Typeでは「固定ページ」を選択し（③）、CommonのLimitは空欄にしましょう。（⑤）
ポイントは④の「Include Only」で、表示したい固定ページのIDを入力します。
固定ページはその性質上、非公開にしておきたいページもありますので、公開したい固定ページの記事IDだけを「Include Only」に入れておくのです。
複数のIDを入れる場合は「,」で区切ります。
Display Settings
「Display Settings」の設定については「投稿」と全く同じでOKです。
↓
全ての設定が終わると「固定ページ」の記事一覧を表示する為のショートコードが画面上に表示されます。
作成したショートコードを固定ページに貼り付ける。
ショートコードを張り付ける場所を固定ページにて作成しましょう。
①「固定ページ」→「新規追加」で新しい固定ページを作成します。
記事タイトルは「全記事一覧」などが無難。
記事本文に「投稿」と「固定ページ」の記事一覧を作成するショートコードを張り付けます。
②記事一覧ページが出来ました。
注意点としては、この記事一覧ページ自体の記事IDを、Content Viewsの固定ページのショートコードの編集画面の「Include Only」に加えておく事。
そして、作成した記事一覧ページをグローバルメニューなどに設置し、読者が見やすいようにしておくという事です。
Content Viewsの各設定について解説！
前章では、しっかりとした記事一覧ページを最短距離で作る事にフォーカスして説明してきましたが、ここでは前章で触れなかった部分の設定について説明していきます。
「見れば分かるわい！」みたいな部分は除いて、ここで説明した方がいいと思われる
- Common
- Advance
- Layout
- Format
- pagination
- Others
について説明していきますね。
言及していない部分は、実際ちょこっと触ってみると分かるレベルだよ。
Common
これは「Filter Settings」にある設定領域で、記事IDを入力する事で記事一覧に含めたり、除外したりできます。
記事IDは半角数字で、複数の記事IDを入力する時は半角コンマ「,」で区切ります。
| Include Only | ここに入力した記事IDの記事だけが一覧に表示されるようになります。 |
| Exclude | ここに入力した記事IDの記事は一覧から除外されます。 |
| Parent Page | ここに入力した記事IDの子ページが表示されます。 入力した記事IDの記事そのものは表示されません。 |
| Limit | 記事一覧ページで出力する記事数の上限です。 全体の記事数が少ないのであれば問題なしですが、多いのであれば後述するPaginationを設定しましょう。 |
Advance
「Filter Settings」にある設定領域です。
ここにチェックを入れた項目によって、出力される記事を整列したり限定できます。
| Taxonomy (カテゴリー, タグ…) | カテゴリーやタグで出力される記事を整列する機能ですが、有料版限定。 |
| Sort by | 出力される記事を記事タイトルやID、投稿日によって並べ替えます。 結構便利。 |
| 投稿者 | 記事投稿者によって一覧を整列する機能です。 1人でやってるブログなら使いません。 |
| ステータス | 公開、下書き、といった記事ステータスによって一覧を分類するのですが、あまり使わないと個人的には思いました。 |
| キーワード | 特定のキーワードが含まれる記事を抽出して一覧にします。 |
Layout
Layoutは「Display Settings」で設定する領域です。
- Grid
- Collapsible List
- Scrollable List
と3つありますが、Collapsible Listが一番無難かな、と感じます。
百聞は一見に如かずなので以下をご覧ください。
Grid
ちょっと大きすぎて見づらい印象。
Collapsible List
これが一番おすすめです。
Scrollable List
ちょっと微妙です（笑）
Format
Formatは「Display Settings」で設定する領域で、サムネイルとテキストを縦に並べるか横に並べるかの違いです。
好みですが、横に並べる方がいいかなーと思ってます。
- Show thumbnail & text vertically：縦
- Show thumbnail on the left/right of text：横（左右は選べる）
Pagination・Others
「Display Settings」で設定する最後の部分がPaginationとOthersです。
PaginationをONにすると、記事一覧をページ分割して表示でき、下部にボタンがページ送りボタンが現れます↓
Othersは記事一覧をクリックした時に、その記事が新しいタブで開かれるか同じタブのまま切り替わるか、です。
直帰率などを下げるという意味では同じタブのまま切り替わる（＝Current tab）するようにした方がいいですね。
記事一覧ページはぜひ作ろう！
絶対とは言いませんが、記事一覧ページはぜひ作ってグローバルメニューなどに設置しておきましょう。
理由は主に2つで
- 読者にとって親切だから。
- 直帰率を下げてくれるから。
です。
「このブログは面白いな！」と読者が感じてくれた時に、全ての記事を一覧で見る事が出来たら親切で便利ですよね。
また、記事一覧ページはブログの直帰率を下げてくれます。
直帰率とは貴方のブログに来た読者が「最初の1ページだけを見て離脱する確率」の事。
直帰率は低い方が検索エンジンの評価が高くなります。
これらの理由からブログには全記事一覧ページがあった方が絶対良い、という訳です。
ぜひ全記事一覧ページを作りましょう！
今回の内容は以上になります。
最後までお読み頂きありがとうございました！
