サイト全体に「モダンブラック 」スキン適用中。

Cocoon Blocksの現在の対応状況

Gutenberg対応デザイン ブロックエディター

Cocoon Blocksで現在利用できるデザインです。

まだまだ全てのCocoonテーマスタイルに対応しているわけではないのでご了承ください。

Cocoon Blocks プラグインはテーマ内に組み込まれました。プラグインを利用している場合は無効にしてください。

スポンサーリンク

Cocoonインライン

Cocoon 1.7.2より、ドロップダウン形式で装飾を選べるようになりました。

ブロックエディターの文章装飾

「文字」リスト

太字(strongタグではなくboldクラスで指定したもの)

吾輩は猫である。名前はまだ無い

赤字

吾輩は猫である。名前はまだ無い

赤太字

吾輩は猫である。名前はまだ無い

青字

吾輩は猫である。名前はまだ無い

青太字

吾輩は猫である。名前はまだ無い

緑字

吾輩は猫である。名前はまだ無い

緑太字

吾輩は猫である。名前はまだ無い

キーボードキー

文字をコピーするには Ctrl + C キーを押してください。

貼り付けをするには Ctrl + V キーを押してください。 ※Windows

打消し線(delでなくsタグを用いた訂正の意味があるもの)

吾輩は猫である。名前はまだ無い

「マーカー」リスト

黄色マーカー

吾輩は猫である。名前はまだ無い

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

吾輩は猫である。名前はまだ無い

赤色マーカー

吾輩は猫である。名前はまだ無い

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

吾輩は猫である。名前はまだ無い

青色マーカー

吾輩は猫である。名前はまだ無い

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

吾輩は猫である。名前はまだ無い

「バッジ」リスト

ちょっとしたワンポイントに利用します。

参考

重要

注目

出典

引用

案内

注意

文献

公式

「フォントサイズ」リスト

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

12px

14px

16px

18px

20px

22px

24px

28px

32px

36px

44px

48px

Cocoonブロック

Cocoonブロックは、ブロック形式のデザインです。まずは、旧エディタースタイルの移植から。

アイコンボックス

インフォメーションボックス

クエスチョンボックス

注意喚起ボックス

  • メモボックス
  • このように箇条書きも
  • 簡単になりました
  1. コメントボックス
  2. 番号つきリストも
  3. 利用可能

OKボックス

NGボックス

GOODボックス

BADボックス

プロフィールボックス

案内ボックス

プライマリー

セカンダリー

サクセス

  • インフォ
  • 非順序リスト
  • ボックス内でリストブロック利用
  1. ワーニング
  2. 順序リスト
  3. pからリストに変換可能

デンジャー

ライト

ダーク

タブボックス

タブボックスを全部表示させると、スペースが必要なので一部だけ。

チェック

コメント

ポイント

TIPS

ヒント

  • ピックアップ
  • 箇条書きも
  • 可能です
  1. ブックマーク
  2. 非順序リストにも
  3. 変換簡単

メモ

ダウンロード

休憩

Amazonの商品紹介などに

OK

NG

GOOD

BAD

プロフィール

白抜きボックス

灰色

黄色

  • 赤色
  • 箇条書き
  1. 青色
  2. 箇条書き

緑色

付箋風ボックス

灰色

黄色

  • 赤色
  • 箇条書き
  1. 青色
  2. 箇条書き

緑色

吹き出し

Cocoonの吹き出し設定に登録した吹き出し設定を即座に呼び出せます。v1.7.0~

「吹き出し」設定の状態がそのまま表示されます。

使用頻度が高いものを呼び出すときに便利。

吹き出しEX

通常の吹き出しを拡張した吹き出し機能です。後から吹き出し表示のスタイルを変更できます。 v1.7.0~

EXで呼び出すと同じ表示スタイルを呼び出し後に変更できます。

人物の位置を変えたり

スタイルをフラットにしたり

LINE スタイルにしたり

アイコンの表示スタイルも変更できます。

ブログカード

もちろん外部リンクも可能。

ボタン

ボタン小

ボタン中

ボタン大

大ボタンは、左右寄せ、中央寄せの変化はなく全て同じです。

囲みボタン

囲みボタンは、アフィリエイトタグなどを改変したくない場合に利用します。

ボタン小

ボタン中

ボタン大

トグル(アコーディオン)ボックス

デフォルトトグルボックスの内容

黄色トグルボックスの内容

赤色トグルボックスの内容

青色トグルボックスの内容

  • 緑色とブルーボックスの内容
  • もちろんリストも使える

検索案内

検索を促すスタイルも表示できます。クリックすると検索もできます(※AMPページでは検索できません)。

汎用ボックス

ボックスの見出し、アイコン、色を自由に選択し、汎用的に利用できるボックスブロックです。

見出しボックス

見出しと内容を書き込める汎用ボックスです。

色は5種類、アイコンは50種類以上の中から選択できます。

案内

ワンポイント案内など。

購入したもの

Amazon関係のないようなど。

注意

注意喚起を促す内容など

経路

交通手段の入力など。

○○の日程

スケジュールなど。

タブ見出しボックス

フォルダー風のタブ見出しボックスです。

色は5種類、アイコンは50種類以上の中から選択できます。

○○のコメント

人物の発言など。

注意しましょう

注意喚起文など。

良かった点

OKな内容など。

良くなかった点

NGな内容など。

質問

問い合わせ内容など。

ラベルボックス

ラベルボックスは、囲み枠の上部にラベル形式で見出しを表示できる汎用ボックスです。

色は5種類、アイコンは50種類以上の中から選択できます。

○○とは

ワンポイント説明など。

○○の経費

金銭に関することなど。

ポイント

ポイントとなるような内容など。

カスタマイズの際は

WordPressカスタマイズの際に気をつけたい点など。

検索を促す内容など。

マイクロコピー

ボタンに付加する 補助文書など。 (v0.1.1~)

マイクロテキスト

\ 無料WordPressテーマ /
/ 100%GPL \
\ 初期セットアップはこちら /
/ 取り扱い説明書 \
\ 全記事一覧 /
/ 様々な記事 \

マイクロバルーン

吹き出しつきのをマイクロコピーです。色も変更できます。

通常のバルーン
円形にもできます
色変更も可能
色変更して円形にするなんてことも
様々なパターン
色は5種類

Cocoonレイアウト

カラム表示をするためのブロックです。今後対応予定。


ブロックエディター
スポンサーリンク
わいひら

無料WordPressテーマ、Simplicity、Cocoonを作成。当サイトと寝ログを運営しています。

わいひらをフォローする
わいひらをフォローする
おすすめレンタルサーバー
mixhost

プラン変更で負荷対策が行えるので、ブログ向きのレンタルサーバーです。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎http/2・QUIC(高速化プロトコル)に対応
◎プランのアップ・ダウングレードが自由自在
◎転送量が多い
◎毎日無料バックアップ(14日分)
◎復元ポイントを指定して復旧可能(無料)
○サーバ引っ越しオプションあり(有料)
○アダルト・出会い系サイト可

安定感抜群のサーバーです。あまり急激なアクセス変動がないアフィリエイトサイトに向いています。

◎nginxを用いた高速サーバー(完全SSD)
◎老舗サーバーなので安定感抜群
◎ディスク容量が多い
◎転送量が多い
◎同サービス内でドメイン管理が可能
○http/2(高速化プロトコル)に対応
○毎日無料バックアップ(14日分)
△DBは7日分だけ無料復旧可能(ファイルは有料)
×プラン変更でCPUのスペックアップができない
×プラン変更しても即時反映されない
×アダルト・出会い系サイト不可

性能も兼ね備えながら安くブログ運営を開始したいのであればここ1択。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎http/2・QUIC(高速化プロトコル)に対応
◎東京・大阪でリージョン選択が可能
◎プランのアップ・ダウングレードが自由自在
◎同サービス内でドメイン管理が可能
◎転送量が多い
◎毎日無料バックアップ(14日分)
◎復元ポイントを指定して復旧可能(無料)
○サーバ引っ越しオプションあり(有料)
△アダルト・出会い系サイト可(条件あり)
△開始したてなので運営能力は未知数(対応良)

格安な値段で始められる高機能サーバーです。
性能も備えつつ最安ならここ。
サイトを続けるうちにアクセスが増えれば、プランのアップグレートで対応可能です。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎激安プランが用意してある
◎値段あたりのスペックが高い(コスパ良し)
◎サーバ引っ越しオプションあり(無料)
○http/2(高速化プロトコル)に対応
○アダルト・出会い系サイト可
△プランのアップは可能だがダウンは不可
△毎日自動バックアップ(1日分)
△前日のバックアップからのみ復元できる(無料)

Cocoon

コメント

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