広告

人気記事ランキングをページや投稿の本文内で表示 – Cocoon

ウィジェットじゃなくて、ページや投稿の本文内で、Cocoon人気記事ランキングを表示します。普通にショートコードで持ってくるだけだけど。

本文内で左右にセパレートして表示したい場合、ブロック挿入ツールの下の方の「Cocoonレイアウト」の2カラム・3カラムが使えます。(モバイル表示だと2カラムでも3カラムでも1カラムずつの表示になるっぽいです。)

ショートコードの例

人気記事のショートコードの基本はこれ↓

[popular_list]

これだけで出力すると、各オプションのデフォルト値がついた状態になる。

任意でここにオプションをつけて表示をカスタマイズしていく。

days=1〜
デフォ値: all
集計する期間を日数で指定
rank=0/1
デフォ値: 0
ランキングの順位を表示するか
pv=0/1
デフォ値: 0
PV数(見られた数)を表示するか
count=1〜
デフォ値: 5
記事の表示個数
type=〜
デフォ値: default
表示のデザインが5種類から選べる
ウィジェットの時の選択肢と同じ
デフォルト: default
区切り線: border_partition
囲み枠: border_square
大きな画像: large_thumb
タイトルを重ねた大きな画像: large_thumb_on
bold=0/1
デフォ値: 0
記事タイトルを太字にするか
arrow=0/1
デフォ値: 0
リンクごとに右に矢印を表示するか
class=”〜”
デフォ値: なし
一覧全体にclass属性を指定するか
cats=カテゴリID
デフォ値: all
表示するカテゴリをカテゴリIDで指定
children=0/1
デフォ値: 0
子カテゴリの内容を含めて表示するか

ショートコードの詳細な説明はCocoon公式のサイトでご確認ください。

↓これだと、直近7日間の集計期間、ランキング順位表示、PV数表示、表示する記事3個、デザインは区切り線って感じ。

[popular_list days=7 rank=1 pv=1 count=3 type=border_partition]

↓出力するとこんな感じ。

Twitterサークル機能、検証してわかったこと 187 views
2022年8月末 IFTTTのGoogleアシスタント連携機能が不便に【"有効にして"は回避可能/別の言い方も追加可能】 142 views
かぶれないFitbitバンド探求記 125 views

ちなみにショートコードは [[内容]] のようにカッコを二重にするとそのまま本文に表示(エスケープ)できるようになる。

コメント

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