サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2020年12月13日 02:57
年末なのとWordPress5.6での仕様変更の影響が大きかったこと、今回のリリース版をテストして不具合報告したのが前日になってしまったこともあり、近いアップデートで予定されている主な変更点をまとめておきます。
開発者だけでなく、運営者にも影響する点が多いので、2021年もWordPressを利用する方は知っておいて損はないと思います。
ロードマップに沿って現在開発が進んでいる内容をまとめたので、細かい変更点は省いています。
補足や訂正、不明な点などがあれば、書き込んでいただけると幸いです。
引用内はCocoonで使用してみた結果、またはCocoonのコードを読んだ上での所感。
【WordPress5.6の主な変更点】
https://wp-cocoon.com/community/postid/42433/
にまとめてあります。
開発者であれば、Block API v2
https://make.wordpress.org/core/2020/11/18/block-api-version-2/
などもけっこう大きな変更だったのではないかと思います。
あと、まだクラシックエディターで記事を書いている方にとっては、5.6がブロックエディターへスムーズに移行できる最後の期間になるかもしれません。
【WordPress5.7で予定されている変更点】
ウィジェットページがブロックエディター化されます。
https://make.wordpress.org/core/2020/09/30/call-for-testing-the-widgets-screen-in-gutenberg-9-1/
5.6で追加される予定だったのですが、カスタマイザーの開発が不十分ということで5.7になりました。
ウィジェットエリアにウィジェットだけではなく、ブロックも並べることができる仕様になります。
Cocoonでは少なくともブログカードブロックが対応できておらず、現在行っている余白の修正に関しても対応が必要になります。
従来のウィジェットも動作しますが、いつまでサポートされるかなどは把握していません。
個人的には、半ばFSEに向けてウィジェットをブロック化するための期間と考えています。
メニュー画面もブロックエディター化され、メニューをブロックでも表示できるようになります。
https://make.wordpress.org/core/2020/09/16/whats-new-in-gutenberg-16-september/
https://make.wordpress.org/core/2020/02/07/navigation-block-exclusion-from-wp-5-4/
ウィジェットと同様、5.6で追加される予定でしたが、より柔軟に機能する方向で開発が進められているため、5.7から5.8に遅れる可能性もありそうです。
メニューの作成は容易になりますが、Cocoonの各ショートコード設定で用いるような使い方には現状あまり適していないので、ブロック化を考えた方がいいのかもしれません。
【FSE（Full Site Editing）】
自身の環境では対応を進めていますが、すでにβ版は出ていて、FSEに対応したブロックベーステーマもいくつか公式テーマとして登録されています。
https://developer.wordpress.org/block-editor/tutorials/block-based-themes/
https://github.com/WordPress/theme-experiments
ウィジェットやメニューなども含め、ひとつのサイトエディター上でブロックを組み合わせ、サイト全体を作成・編集することができるようになります。
今まではテーマの各テンプレートファイルに書き込んでいたHTMLですが、テーマ有効化とともに一度データベースに保存され、ブロックエディターから編集します。
テンプレートファイルに直接追記しないといけなかったことが、ウィジェット感覚でできるようになるイメージです。
ブロックベーステーマのテンプレートファイルはHTMLで書かないといけないため、Cocoonのような多機能テーマやプラグインの開発・カスタマイズでは基本的にブロックを扱わないといけなくなります。
また、head要素（wp_head関数）以上やwp_footer関数以下のHTMLは直接触れないので、header.phpやfooter.phpに記述しているHTMLは全部フックを通さないといけません。
最近のGutenberg開発の大半はFSE関連に費やされているので、早ければ5.8-5.9あたりで正式にリリースされるのではと考えています。
今のところ、ブロックベーステーマにしない限りはFSEはオフになります。
FSEとおそらく同時に、グローバルスタイルというシステムも導入されます。
https://developer.wordpress.org/block-editor/developers/themes/theme-json/
https://github.com/WordPress/gutenberg/issues/19611
サイト全体の
- フォント
- 余白
- カラー
といったデザインをJSONで記述し、JSONをもとにCSSが出力されます。
グローバルスタイルに基づいてブロックを設計しておくことで、テーマ変更時やブロックディレクトリのブロック追加時にブロックのデザインが崩れないようにするための仕組みです。
サイト制作のエコシステムとしては非常に便利だと感じますが、初心者にとっては今までよりもカスタマイズのハードルが少し高くなりそうです。
グローバルスタイルはFSE専用というわけではなさそうなので、開発が進むにしたがってCocoonでCSS関連の不具合が出ると思います。
Topic starter
2020年12月17日 20:21
FSEやグローバルスタイルに関する補足です。
FSEではグローバルスタイルなど、主にサイドバー上で各種スタイルの設定値を制御する機会が増えるのですが、そのUI/UXを向上させるために、
WordPress Components V2 (G2 Components)
というプロジェクトが立ち上がっています。
- https://github.com/WordPress/gutenberg/issues/24341
- https://github.com/WordPress/gutenberg/issues/27331
FSEがリリースされるまでには、ブロックエディター上の少なくとも設定周りのデザインや操作性が一新されるようです。
（ただし、個々のブロックの操作性はそのブロックが各所に適切なコンポーネントを採用できているかどうかにもよる。）
https://make.wordpress.org/core/2020/11/10/twenty-twenty-one-dark-mode-update/
WordPress5.6に同梱されている公式テーマ「Twenty Twenty-One」ではダークモード機能が実装されていますが、その辺りもエディター側に反映しやすい仕様になるのではないかと思います。
2020年12月18日 00:44
はじめまして。
よくCocoonにお世話になっているしがないデザイナーしております。
大変興味深く読ませていただきました。
Cocoonはどこまで対応するのか知りたいところであります。
直近のアップデートはまだ不具合の報告が散見され、よく分かっておらずなので、どれが修正されればWordpress共々更新してもよいのかも知りたくあります。
2020年12月18日 15:44
度々申し訳ございません。
昨夜、フルサイトの機能を触ってどのようにサイトを作ればよいのか勉強しておりました。
ブロックのウィジェットを触った経験はありましても、1日2日で理解は難しそうであります。
そこで、フォーラムで回答されておられる皆さんは、ブロックの制作などどう学習されたのかお聞きしたいところであります。
Topic starter
2020年12月19日 22:28
劇的に変わってきますね…。
フェーズ２は元々2020年中に完成予定だったことから、2021年は大変な1年になりそうです。
特にFSEと旧エディターの対応は両立しないので、次回アップデートあたりでそろそろ旧エディターのサポートをどうするか考えないといけなくなるかもしれません。
直近のアップデートはまだ不具合の報告が散見され、よく分かっておらずなので、どれが修正されればWordpress共々更新してもよいのかも知りたくあります。
エラーなく動作するレベルを求めるのであれば、少なくとも
が修正されるまでではないかと。
ブロックの制作などどう学習されたのかお聞きしたいところであります。
私は元々フロントエンドの技術には疎く、Gutenbergが出るまではなるべく避けてきたのですが、Gutenberg時代のWordPressではモダンなフロントエンド開発のノウハウがそのまま役に立つと思い、幅広く学習する時間を作っています。
Gutenbergでできる大抵のことはブロックエディターの公式ドキュメントに書かれていますが、React自体を理解しない限りサンプル以上のコードは書けないので、ただブロックを作ってみるだけでなく、React系のフレームワークなども触ってみるのがいいと思います。
ichigo reacted
2020年12月20日 00:02
アップデートの件、承知しました。
まだしばらくは様子を見る所存であります。
2020年12月20日 00:17
今後ブロックを制作していくにはバックにある技術、周辺にある技術を幅広く理解していかないと難しいわけですか。
この年末年始を使って、まずは最新バージョンまで知識が追いつけるよう勉強するつもりでおります。
他の回答者様方、制作者様方にも意見を伺いたく思っております。
フルサイトに向けて、皆さんは知識面や制作面でどのように進めておられるのでしょうか？
2020年12月20日 01:17
「ブロック制作」というのは、ブロックベーステーマのテーマをご自身で制作されるという意味で合ってますかね？？
私は単に利用者側なので特に勉強等していません。
既存のテーマをFSEに対応させるとしたら大変そうだな～と思っています。
2020年12月20日 17:07
申し訳ありません。
ブロック制作と言いますのは、gutenbergエディターで使用するブロックの制作という意味で申し上げたつもりであります。
フルサイト関係なく、サイトをデザインするにしましても、カスタマイズするにしましても、結局ブロックを介さなければならないというところは理解しております。
制作者様やフォーラムの回答者様はブロックへの理解が必要不可欠となるわけでありますので、どのように理解を深めておられるのか知りたかったところであります。
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。