ウィジェットに注目記事一覧を表示させる方法【Cocoon】

Cocoon
スポンサーリンク

当ブログは収益を目的としたアフィリエイト広告およびアドセンス広告を使用しており、記事内にそれらの広告が含まれる場合があります。

ブログサイトの運営者には「読んでほしいけど埋もれてしまっている記事がある」というかたも多いのではないでしょうか?

ウィジェットの管理画面の「新着記事」や「人気記事」では、自分で抽出した記事を表示させることはできません。

この記事は、あらかじめ「メニュー」を作成し、ショートコードを使ってウィジェットに設置するための方法です。

使用するWordPressテーマは『Cocoon』です。

メニューを作成する

「外観」「メニュー」から、「新しいメニューを作成しましょう」をクリックします。

あとで管理しやすい(わかりやすい)メニュー名をつけて、「メニューを作成」をクリックします。(※ここのメニュー名が、ウィジェット上の表示タイトルになるわけではありません。)

左側の「メニュー項目を追加」で、「投稿」「すべて表示」のタブを選択します。

全投稿記事のなかから、一覧に表示させたい記事にチェックを付け、「メニューに追加」をクリックします。

「チェック」を付けて「メニューに追加」をクリックすると、右側に追加されていきます。まとめて選択(チェック)をすることもできますが、私は右側のメニューを見ながらひとつひとつ追加していくようにしています。

スポンサーリンク

予想はしていましたが、こんな感じになってしまいました。

それだけ、読んでほしい(埋もれている)記事が多いということですが、これではさすがに多すぎです。

記事数を削りながら、同時に並べかえもやっていきます。

最後に、いちばん下の「メニューを保存」をクリックして、メニューが完成です。

とりあえずメニューだけ作成しておけば、表示させる記事は、あとからでも同じ手順で選択・削除ができます。

スポンサーリンク

作成したメニューをウィジェットに設置

「外観」「ウィジェット」の管理画面を開き、「テキスト」「ウィジェットを追加」をクリックします。

一覧のタイトルをつけて、テキストの部分に以下のショートコードを入力し、「保存」をクリックしたら完了です。(「注目記事」の部分は、先ほど作成した「メニュー名」を入力します。)

[navi_list name="注目記事"]

間隔のバランスのよい注目記事一覧が完成しました。

スポンサーリンク

カードをカスタマイズ

ここからはまた「外観」「メニュー」の画面で設定します。

記事タイトルを書き換える

「ナビゲーションラベル」で、本来の記事タイトルとは異なるタイトルをつけることができます。

この部分を書き換えて「メニューを保存」をクリックすると…

注目記事の一覧に表示されるタイトルが変わります。
(※記事のタイトルが変わるわけではありません。)

カードにラベルをつける

「CSS class」に1~5までの数値を入力することで、カードに任意のリボンをつけることができます。

たとえば「1」を入力して「メニューを保存」をクリックすると…

「おすすめ」のリボンがつきます。

1~5をすべて入力してみるとこんな感じです。

それぞれの数値に対応したラベルが付きます。

「1」…『おすすめ』
「2」…『新着』
「3」…『注目』
「4」…『必見』
「5」…『お得』

説明文を加える

「説明」で補足説明を付け加えることができます。

テキストを入力して「メニューを保存」をクリックすると…

カードに説明文がつきます。

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