【Cocoon】スタイル使い方 標準装飾一覧

Cocoon

Cocoon

このブログは、Wordpress テーマのCocoon(無料)を使っています。
(現在、過去記事を修正中なので見難い箇所があります。)

CSS不要で簡単に使えるCocoon標準装飾一覧です。

使い方

基本の使い方は、装飾したい部分を選択(ドラッグ)して、装飾ボタンを押します。装飾は重ねることもできます。

例:赤色太字+黄色マーカー赤色太字

取り消すときは、取り消したい部分を選択して、不要の装飾ボタンを押します。

例:赤色太字+黄色マーカー色太字


文字だけでなく、マーカーを重ねることもできます。

例:黄色マーカー+赤色アンダーラインマーカーかわいいテープみたい


見出し

標準の見出しです。



見出しH2

見出しH3

見出しH4

見出しH5

インライン

太字
赤字
赤太字
赤アンダーライン

青太字

緑太字
打ち消し線
キーボードキー

インライン画像

文字の途中に画像を置くこともできます。


今日は、 食べたよ。

画像を置きたいところで、「インライン画像」を押すと、画像選択画面がでてきます。

マーカー

黄色マーカー
赤色マーカー
青色マーカー
黄色アンダーラインマーカー
赤色アンダーラインマーカー
青色アンダーラインマーカー

フォントサイズ

12px
14px
16px
18px
20px
22px
24px
28px
32px
36px
40px
44px
48px

標準のフォントサイズを変更するには、

「ダッシュボード」→「Cocoon設定」→「全体」→「サイトフォント」

で、文字サイズを変更します。

ボックス(アイコン)

補足情報(i)
補足情報(?)
注意喚起(!)
メモ
コメント
OK
NG
GOOD
BAD
プロフィール

ボックス(案内)

プライマリー(濃い水色)
セカンダリー(濃い灰色)
サクセス(薄い緑)
インフォ(薄い青)
ワーニング(薄い黄色)
デンジャー(薄い赤色)
ライト(白色)
ダーク(暗い灰色)

ボックス(白抜き)

灰色
黄色
赤色
青色
緑色

ボックス(タブ)

それぞれ、灰色・黄色・赤色・青色・緑色の色から選べます。

チェック
コメント
ポイント
ティップス
ヒント
ピックアップ
ブックマーク
メモ
ダウンロード
ブレイク
Amazon
OK
NG
GOOD
BAD
プロフィール

ボックス(付箋風)

灰色
黄色
赤色
青色
緑色

バッジ

オレンジ

レッド

ピンク

パープル

ブルー

グリーン

イエロー

ブラウン

グレー

使い方の例

お知らせ 2032年にデビューします。
 ここ重要ポイント。
 OK

マイクロコピー

テキスト(上)
 
テキスト(下)
吹き出し(上)
 
吹き出し(下)

位置は左側にしています。

左側 中央 右側

位置は、左側 中央 右側にも動かせます。
 
 
テキスト(上)
テキスト(下)
吹き出し(上)
吹き出し(下)

上付き

Frequent Flyer※1について

注釈を付ける時に便利です。

ボタン

レッド(小)

レッド(中)

レッド(大)

ピンク(小)

ピンク(中)

ピンク(大)

パープル(小)

パープル(中)

パープル(大)

ディープパープル(小)

ディープパープル(中)

ディープパープル(大)

インディゴ[紺色](小)

インディゴ[紺色](中)

インディゴ[紺色](大)

ブルー(小)

ブルー(中)

ブルー(大)

ライトブルー(小)

ライトブルー(中)

ライトブルー(大)

シアン(小)

シアン(中)

シアン(大)

ティール(小)

ティール(中)

ティール(大)

グリーン(小)

グリーン(中)

グリーン(大)

ライトグリーン(小)

ライトグリーン(中)

ライトグリーン(大)

ライム(小)

ライム(中)

ライム(大)

イエロー(小)

イエロー(中)

イエロー(大)

アンバー(小)

アンバー(中)

アンバー(大)

オレンジ(小)

オレンジ(中)

オレンジ(大)

ディープオレンジ(小)

ディープオレンジ(中)

ディープオレンジ(大)

ブラウン(小)

ブラウン(中)

ブラウン(大)

グレー(小)

グレー(中)

グレー(大)

ふりがな(ルビ)

文字もじにふりがなをけることもできます。






あわせて読みたい

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