Cocoonでカスタマイズしている各種パーツの出来などを確認する用のページです😇
目次
SANGO風に。
MoKuJi
各種タグ
H1〜H6まで
H1はこんな感じ（タイトル用）
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
H2はこんな感じ
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
H3はこんな感じ
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
H4はこんな感じ
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
H5はこんな感じ
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
H6はこんな感じ
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Cocoon製ボックス
タブ付きボックスを整形しています。
独自に作ったボックス
独自にボックスを作って使っています。
まずはシンプルなやつ
- こうした組み合わせも可能
- です
吹き出し系
ここに内容を書く
ここに内容を書く
改行したらこんな感じ
ここに内容を書く
色々特化したやつ
- LIST 5
- あんな人
- こういう感じっぽい人
- LIST 6
- あんな人
- ああいう感じを醸し出してる人
- LIST 7
- ああいう人
- こんな感じっぽい雰囲気の人
- LIST13
- サンプルテキスト99999
- サンプルテキスト99999
アイコン付きボックス
タイトルが変えられるボックス
- サンプルテキスト11-11-11-11
- サンプルテキスト11-11-11-11
- サンプルテキスト11-11-11-11
- サンプルテキスト11-11-11-11
- サンプルテキスト11-11-11-11
- サンプルテキスト11-11-11-11
- サンプルテキスト7-7-7
- サンプルテキスト7-7-7
- サンプルテキスト7-7-7
- サンプルテキスト6-6-6
- サンプルテキスト6-6-6
- サンプルテキスト6-6-6
- サンプルテキスト14-14
- サンプルテキスト14-14
- サンプルテキスト14-14
リスト色々
続いては箇条書きやまとめ的な時に使えるリストパーツです。
基本群
数字リスト
- 番号を振りたいときは
- これを使っています
- ちょっとデザイン変えたい
枠なし
- LIST 2
- ポイントまとめ的なのとか
- チェックリストは割とよく使ってます
上下枠 + 基本ドット
- LIST 3
- カラーとか
- デザインも自由自在
上下枠 + チェック
- LIST 4
- このデザインで統一しておりますが、
- 論理的には無限に作れます
色違いシンプルシリーズ
5. チェック（ブラック）
- LIST 5 LIST 5
- LIST 5
- LIST 5
6. チェック（グリーン）
- LIST 6 LIST 6
- LIST 6
- LIST 6
7. チェック（コーラル）
- LIST 7 LIST 7
- LIST 7
- LIST 7
8. ドット（ブラック）
- LIST 8 LIST 8
- LIST 8
- LIST 8
9. ドット（グリーン）
- LIST 9 LIST 9
- LIST 9
- LIST 9
10. バツ（ブラック）
- LIST 10 LIST 10
- LIST 10
- LIST 10
11. バツ（レッド）
- LIST 11 LIST 11
- LIST 11
- LIST 11
色違いシンプルシリーズ（黒背景用）
12. チェック（グリーン）
- LIST 12 LIST 12
- LIST 12
- LIST 12
13. チェック（レッド）
- LIST 13 LIST 13
- LIST 13
- LIST 13
14. ドット（グリーン）
- LIST 14 LIST 14
- LIST 14
- LIST 14
15. ドット（イエロー）
- LIST 15 LIST 15
- LIST 15
- LIST 15
16. バツ（イエロー）
- LIST 16 LIST 16
- LIST 16
- LIST 16
17. 記事冒頭サマリー
- LIST 20 LIST 20
- LIST 20
- LIST 20
強調パーツ
記事の見易さを考えて作った強調パーツいろいろ。
比較要素にも
Q & Aにも
比較表
2つの何かを比較するときに使える比較表。
- 短髪が多い
- 基本ズボン
- 基本化粧はしない
- 長い髪も多い
- スカートもはく
- 大人になると化粧をする
まあこんな感じとか、
ビフォーアフターとかでも使えます。
- 濃厚接触♡
- レッツGOエブリウェア
- マスクは花粉症や風邪の時
- ソーシャルディスタンス
- 不要不急のお出かけ控えましょう
- 外出時は必須
かなり有用。
使い方は工夫次第。
- リスト1
- リスト2
- リスト3
- リスト1
- リスト2
- リスト3
リンク関係
ボックスのみ
単体
合体
引用
引用ボックスも整形済み。
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
引用：引用元の記事タイトル
