WordPressの新エディタ「Gutenberg」のブロックについて、まとめていきます。
本記事では、「Cocoon」テーマ専用のブロックについて取り上げます。
- WordPressでCocoonを使っている人
- 新エディタ「Gutenberg」に変えようか迷っている人
WordPress自体の基本ブロックに関しては以前の記事をどうぞ。
Cocoonテーマ専用のブロック
Cocoonブロック
ブログカード
ブログやサイトのリンクを貼りたいときに使います。ピックアップ等のラベルは決められた中から変更可能。
囲みボタン
うまく機能しないので、でき次第追記します。
アイコンボックス
案内ボックス
色付きの背景で目立たせることができます。
白抜きボックス
囲ったボックスの中に文章がかけます。
- リストも
- 入れられます
Newボックスの色が増えています。
付箋風ボックス
付箋風のボックスです
タブボックス
タブのついたボックスです。タブの名前は選択可能。
吹き出し

Cocoonに登録してある吹き出しもここから呼び出せました!
ボタン
Newボタンの角を丸くしたり、ボタンを光らせたりできます。

新エディタに乗り換えようと思った理由の一つです。このような細かい機能が沢山増えています!
トグルボックス
あまり重要でないものや蛇足な情報はトグルボックスで隠しておきましょう。
New色の変更が可能になりました。
検索案内
New検索を案内できます。どのように使っていくのかは模索中です。
タイムライン
- ステップ1前日は夜ふかしする
やることないのに無駄に起きてます
- ステップ2朝は眠いのでお昼まで寝る
目が覚めても二度寝しましょう
- ステップ3お腹が空いたらピザでも頼む
エアコンの効いた部屋から出たくありません
- ステップ4YouTubeでも漁ってると夜になるので寝る
無限に時間を捨てられます
New新機能です。手順を説明するのに非常に使えそうです。
アイコンリスト
Newリストタイトルが入れられるのも細かいですが、嬉しいポイントです。
Cocoon汎用ブロック
ラベルボックス
New新しい機能です。見出しを変えられるので汎用性は高いです。
見出しボックス
New見出しボックスバージョン。
タブ見出しボックス
Newタブバージョンです
Cocoonマイクロコピー
マイクロテキスト
ボタンやブロックに対して、アピールしたい一言を付け加える事ができます。
マイクロバルーン
Newバルーンの形を円形にもできるようになりました。
Cocoonレイアウト
2カラム
段落1つ目
段落2つ目
カラムの比率を変更することもできます。
3カラム
段落1
段落2
段落3
編集画面では段落ごとに色がついて見やすくなっていますが、実際の記事では色がつかないので注意。
新しく追加された機能まとめ
「Gutenberg」でCocoonブロックを使った感想
一通り、全機能を使ってみることでCocoonブロックの概ねの使い方は理解できました。
旧エディタで出来ていたことは、ほぼ全て新エディタ「Gutenberg」でも出来ると思います。(現状では不可能なものは思いつきません)
半年以上、旧エディタに依存していましたが、思っていた以上にハードルの高いものではなかったように感じます。

長い間使っていた人ほど、新しいものに乗り換えるのは腰が重いわよね。

半年も使ってなかった私でさえ、大きな仕様変更だったので大変だったよ。
最後まで読んでいただきありがとうございました。
Twitterでも発信しているのでフォローお願いします。(@manimani_blog)
コメント