広告

人気記事ランキングをページや投稿の本文内で表示 – 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]

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

楽天モバイルから日本通信SIMの合理的シンプル290プランへ乗り換え 99 views
DHLの対応が思ったよりよかった(DHLで荷物が届くまでのあれこれ) 68 views
AirMacの楽天ひかり接続設定備忘録 52 views

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

コメント

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