Cocoonには記事を装飾するタグがたくさんあって、どれがどんなデザインかがわからなくなる。
ということでまとめます。
スタイル
インライン
・bold → 太くする
・strong → 強調する
本装飾はbold。
WordPress標準の「B」ボタンや、⌘ command+Bはstrong。
boldは単に文字を太く見せるだけで、strongは指定した単語や文章を文脈的に強調する。boldにGoogleの評価は無いがstrongは評価される。良くも悪くもstrongは評価されるので太字はboldを使った方が無難という情報がある。
赤字
赤太字
青
青太字
緑太字
打ち消し線
キーボードキー
マーカー
赤色マーカー
青色マーカー
赤色アンダーラインマーカー
青色アンダーラインマーカー
フォントサイズ
省略。
ボックス（アイコン）
ボックス（案内）
ボックス（白抜き）
ボックス（タブ）
ボックス（タブ）> チェック
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> コメント
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> ポイント
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> ティップス
灰色・黄色・赤色・青色・緑色の5色
ちなみに「TIPS」とはアドバイスやコツという意味。筆者は英語が弱いので使い方に困ってしまうのでメモ。
ボックス（タブ）> ヒント
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> ピックアップ
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> ブックマーク
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> メモ
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> ダウンロード
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> ブレイク
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> Amazon
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> OK
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> NG
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> GOOD
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> BAD
灰色・黄色・赤色・青色・緑色の5色
ボックス（タブ）> プロフィール
灰色・黄色・赤色・青色・緑色の5色
ボックス（付箋風）
バッジ
レッド
ピンク
ブルー
グリーン
ブラウン
グレー
マイクロコピー
リンクやボタンにコメントを付けたい時に使うものらしい。
マニュアルを見た方がわかりやすい。
https://wp-cocoon.com/micro-copy/
マイクロコピー > テキスト（上）
マイクロコピー > テキスト（下）
マイクロコピー > 吹き出し（上）
マイクロコピー > テキスト（下）
ボタン
囲みボタン
普通のボタンとの違いがわかりづらいので、以下のページを見た方が良いかも。
https://wp-cocoon.com/wrap-button/
囲みブログカードラベル
関連記事
参考記事
参考リンク
人気記事
あわせて読みたい
詳細はこちら
チェック
ピックアップ
公式サイト
ダウンロード
吹き出し
悩むおばさん（左）なのに右に表示されますが細かいことは気にしないでおこう。
テンプレート
WordPressカスタマイズ注意文サンプル
[temp id=1]
アフィリエイト
アフィリエイトタグサンプル
[affi id=1]
タグ
カラムは省略。
検索フォーム風
トグルボックス
以下のボタンを押すと内容が出てくる。
ふりがな（ルビ）
振り仮名
ショートコード
広告［ad］
Cocoon設定 ＞ 広告タグ ＞ [ad]ショートコード
[ad]
新着記事一覧
[new_list count=”5″ type=”default” cats=”all” children=”0″ post_type=”post”]
人気記事一覧
[popular_list days=”all” rank=”0″ pv=”0″ count=”5″ type=”default” cats=”all”]
ナビカード一覧
任意の記事一覧を表示させる時に使用。
https://wp-cocoon.com/navi-card-shortcode/
プロフィールボックス
[author_box label=この記事を書いた人]
Amazon商品リンク
[amazon asin=”B08PP8T15H” kw=”進撃の巨人”]
| ASIN | Amazonの商品ページで取得（B08PP8T15Hのような番号） |
| キーワード | 該当商品を見つけるためのキーワード |
Amazon商品リンク（商品タイトル変更）
[amazon asin=”B08PP8T15H” kw=”進撃の巨人” title=”進撃の巨人33巻”]
Amazon商品リンク（全ボタン非表示）
[amazon asin=”B08PP8T15H” kw=”進撃の巨人” amazon=0 rakuten=0 yahoo=0]
楽天商品リンク
省略。
楽天商品リンク（商品タイトル変更）
省略。
楽天商品リンク（全ボタン非表示）
省略。
タイムライン・タイムラインアイテム
タイムラインとタイムラインアイテムはセットで使う。
使用例
[timeline title=”タイムスケジュール”]
[ti label=”7:00″ title=”起床”]目覚まし時計で起きる[/ti]
[ti label=”23:00″ title=”就寝”]目覚まし時計を7時にセット[/ti]
[/timeline]
過去日時
[ago from=”2016/04/01″]
これは便利。◯年前という表記をリアルタイムに表示したい時に使用。
例えば、2年前のことを記事で書くとする。1年後には3年前のことになるが、このタグを使うことで自動的に3年前と表示させることができる。
ago from=”YYYY/MM/DD”で指定。「◯年」と表示される。
過去年
[yago from=”2016/04/01″]
yago from=”YYYY/MM/DD”で指定。年はつかずに何年前という意味で数字だけが表示される。
年齢
[age birth=”2000/01/01″]
リアルタイムの年齢を表示させたい時に使用。
age birth=”YYYY/MM/DD”で指定。「◯歳」と表示される。
