WordPressのブロックエディターでサイト全体を編集
独自のビルダーもショートコードも使いません。Canvasは、ヘッダー、ヒーロー、ページタイトル、コンテンツ、フッターを編集キャンバスに配置し、実際のデザインに必要な設定を、コアブロックを含むすべてのブロックに追加します。
更新日:
ページは、公開時の見た目どおりに開きます
Canvasは、ブロックエディターがテンプレート全体を描画するように設定します。ヘッダーやヒーロー、ページタイトルバンド、コンテンツ、フッターまですべてがキャンバス上に表示され、フロントエンドを描画するのと同じコードで描かれます。

編集した内容が、そのまま訪問者に届きます
多くのテーマは、エディターには白い箱だけを渡し、デザインはフロントエンドに任せています。Canvasはコンテンツの周囲にテンプレートを描画するため、ページの横ではなく、ページの中で直接編集できます。
- エディターとフロントエンドに共通の1つのレンダラー
- テンプレートは表示されますが、ページから直接編集することはできないため、サイトの共通パーツを誤って壊してしまう心配はありません。
- このページに割り当てられた Hero、Slider、ページタイトルは、公開前の時点で既に用意されています
- 幅と余白は実際のテンプレートから取得されるため、全幅のセクションは全幅で表示されます
WordPressが管理しているテンプレートとスタイル
Canvasは、WordPressのブロックテンプレートをベースに構築されています。テンプレートはブロックテンプレート、パーツはテンプレートパーツであり、色とタイポグラフィはtheme.jsonから読み込まれます。そのため、サイトの設定が当社独自の設定パネルの中に隠されることはありません。
173件のテンプレートと4種類のスタイルバリエーション
投稿、ポートフォリオ作品、イベント、商品、デモに含まれるすべてのコンテンツタイプ向けのシングルレイアウトと、ランディング、スプラッシュ、フラッシュ、フルブリードのページ向けのページレイアウトを用意しています。
- 173件のブロックテンプレート(サイトエディターで編集可能)
- ヘッダー、フッター、ページタイトル、サイドバー用のテンプレートパーツ5個
- 4種類のスタイルバリエーション、ダークやミッドナイトを含む
- theme.json のカラーとタイポグラフィは1か所で設定され、エディターとフロントエンドの両方に反映されます

訪問者に表示されるものはすべて、設定で変更できます。
テキストとリンク、画像とアイコン、色、サイズ、動作。ブロックが表示するものはすべて、サイドバーのコントロールで変更できます。コードエディターを使う必要はありません。

一度設定すれば、どこでも再利用できます
2つの仕組みが繰り返しの作業を省いてくれますが、解決する問題はそれぞれ異なります。
- 既定値として保存します。ブロックを好みの状態に設定し、そのブロックタイプの既定値として保存できます。次に挿入するブロックは、その既定値から始まります。アンカーや追加のCSSクラスなど、ブロックの識別に関わる設定は、コピーされません。
- グローバルブロックスタイル。設定のまとまりをプリセットとして名前を付け、サイト全体のブロックに適用できます。プリセットを一度変更すれば、それを使用しているすべてのブロックに反映されます。
コアブロックを含め、すべてのブロックで同じ4種類のコントロール
Canvasは、サイトに登録されているすべてのブロックタイプに、自身のブロックだけでなく高度な設定パネルを1つ追加します。コアの段落ブロックにも、Canvasブロックと同じアニメーション、CSS、属性、表示の設定項目が追加されます。
アニメーション
入場アニメーションは速度と遅延を個別に設定でき、退場アニメーションにも独自の遅延を設定できます。表示されないまま、読み込まれない JavaScript を待つ要素はありません。
カスタムCSS
このブロック専用のCSSを書けます。CanvasはそのCSSをこのブロックだけに適用し、WordPressがインラインスタイルに使うのと同じフィルターで処理します。
カスタム属性
アナリティクスのフックやテスト用の識別子、属性を必要とするサードパーティ製スクリプトのために、ブロックのルート要素に独自の属性を追加できます。
表示条件
ユーザーロールやデバイスに応じてブロックを表示・非表示にできるため、会員限定パネルやスマートフォン専用の通話ボタンにプラグインは不要です。
カスタムクラスとHTMLアンカーは、おなじみのWordPressのフィールドにそのまま残っています。そのため、ここで学ぶ内容はCanvas独自のものではありません。これらは通常のブロック属性なので、パターンやスクリプトからも同じように設定できます。
183件のパターンをカテゴリー別に分類
パターンは通常のブロックとして挿入されるので、並べ替え、書き換え、削除を自由に行えます。セクションの出発点であり、回避しなければならないロックされたレイアウトではありません。
- 40ヘッダー
- 24コンテンツ
- 22フォーム
- 16 フッター
- 14ブログ
- 13Hero
- 12ギャラリー
- 12コールトゥアクション
- 9料金
- 9ページ
- 8機能
- 5イベント
- 4ポップアップ
- 3ソーシャル
- 2お客様の声
- 2ポートフォリオ
- 1件のFAQ
パターンは複数のカテゴリーに分類できます。ヘッダーとフッターのパターンはヘッダービルダーのページで解説しており、すべてのパターンはブロックライブラリにあるブロックで構成されています。
コンテンツはブロックマークアップのまま
Canvasが提供できる最大の強みは、コンテンツのどの部分も独自仕様ではないことです。Canvasのブロックは、WordPressのブロックと同じ形式で保存されます。
- Canvasのブロックはすべて、本格的な設定パネルを備えた登録済みブロックタイプで、ショートコードではありません。
- 属性は通常のブロック属性のため、パターン、REST API、コマンドラインからも設定できます。
- ブロックはテーマではなくCanvasプラグインに含まれているため、テーマを変更してもページが失われることはありません。
- コアブロックも引き続き動作し、同じ高度な設定パネルが利用できるようになります。
WordPressのインサーターで使える209個のブロック
Canvasのブロックはコアブロックと並んで提供され、独自の10種類のカテゴリーにまとめられています。さらに105個のブロックはデモ固有のもので、必要とするデモと一緒に表示されます。
名前でブロックを検索
- 名前やキーワードで検索できるほか、Canvasのカテゴリーも含まれます。
- 同じ「パターン」タブにある183個のパターン
- 314個のブロックのうち228個が無料枠で、残りはすべてのプランに含まれます。
- ページには、含まれているブロックのCSSとJavaScriptだけが読み込まれます。

ここでできる操作がさらに3つ
ヘッダー、デモ、コピーは別々のアプリケーションではありません。いずれも、このページで説明しているエディターで、同じキャンバスと同じサイドバーを使って開きます。
ページビルダープラグインは必要ですか?
Canvasにページビルダープラグインは必要ありません。Canvasは、コンパニオンプラグインを備えたWordPressテーマです。そのため、すべてのブロック、ヘッダー、フッター、ヒーロー、ページタイトルは、ブロックエディターとWordPressに標準搭載のサイトエディターで編集します。覚えるべき別のエディターも、暗記すべきショートコードも、テーマと一緒に更新すべきビルダーのライセンスもありません。
テーマを切り替えると、ページが崩れますか?
コンテンツは、ショートコードではなく標準のブロックマークアップとして保存されるため、コアブロックはどのテーマでも表示され続けます。CanvasブロックはテーマではなくCanvasプラグインから提供されるため、テーマを変更しても投稿やページからCanvasブロックが削除されることはありません。
サイトエディターで、テンプレートを引き続き編集できますか?
はい、Canvasには173個のブロックテンプレート、5個のテンプレートパーツ、4種類のスタイルバリエーションが含まれ、すべてWordPressが管理するサイトエディターで編集できます。カラーとタイポグラフィはtheme.jsonから読み込まれるため、スタイルパネルでの変更はすべてのページに反映されます。
コアブロックの詳細オプションとは何ですか?
Canvasでは、コアブロックにアニメーション、カスタムCSS、カスタム属性、表示条件を追加できます。サイトに登録されているすべてのブロックタイプ(他のプラグインのブロックを含む)に同じパネルを追加するため、コアブロックと必要な設定を持つブロックのどちらかを選ぶ必要はありません。
ライセンスの期限が切れると、何が使えなくなりますか?
Canvasのライセンスの有効期限が切れても、フロントエンドの動作は止まりません。サイトは現在と同じように表示され続け、プレミアムブロックも引き続き使えます。停止するのはサービスです。アップデート、デモのインポート、CanvasAI Engineによる生成、プレミアムブロックの編集は、更新するまで利用できなくなります。ライセンスの確認が当社サーバーに接続できない場合は、14日間の猶予期間があります。
Canvasで次のウェブサイトを構築しましょう
初心者でも、フリーランサーでも、エージェンシーでも、同じブロックとデモを利用できます。まずは1つのサイトから始めて、同じライセンスで必要な数だけサイトを構築できます。



