ブロックテーマを、WordPressがそのまま保持する場所で編集
テーマにはテンプレート、テンプレートパーツ、スタイルバリエーションが含まれ、プラグインにはブロックライブラリ、ビルダー、フォーム、SEOとパフォーマンスの機能、デモのインポーターが含まれます。テンプレートとグローバルスタイルはサイトエディターに残るため、サイトの何かが当社の設定パネルの中に隠されることはありません。
- 173件のブロックテンプレートと5件のテンプレートパーツがあり、すべてサイトエディターで編集できます。
- ダークとミッドナイトを含む4種類のスタイルバリエーションを、サイトエディターで切り替え
- 色とタイポグラフィはtheme.jsonを通じて適用されるため、エディターにはフロントエンドと同じ書体が表示されます
- 183個のブロックパターン、マークアップの一回限りのコピーとして挿入
- ページを開くと、編集中のコンテンツを囲む形で、テンプレート全体が表示されます。
データベースに最終的に保存されるのはブロックマークアップです
ブロックテーマを選ぶ理由は機能の一覧ではありません。5年後に手元に残るものが、その答えです。
独自フォーマットなし
Canvasは標準のWordPressブロックを編集するもので、独自の形式は持ちません。そのため、テーマを変更しても投稿やページのコンテンツはそのまま残ります。覚えるべきショートコードも、開くべきコードビューもありません。
コードスニペットではなく設定で
訪問者が目にするものはすべて、ブロックの設定パネルから操作できます。デモに必要な内容をブロックで表現できない場合は、ブロックに設定項目が追加され、ページに生のHTMLが追加されることはありません。
すべてのブロックの詳細パネル
エディター内のすべてのブロック（コアブロックとサードパーティ製ブロックを含む）に、アニメーション、表示条件、カスタムクラス、カスタム属性、ブロックごとのカスタムCSSが追加されます。
アセットはページに連動
ページは、含まれるブロックのCSSとJavaScriptだけを読み込むため、料金ページがスライダーのスクリプトを読み込むことはありません。さらに35件の最適化は、切り替えスイッチで操作でき、インストールするプラグインは不要です。
他のテーマからの移行ですか？Elementor と Divi は独自のエディターでページを作るため、ビルダーを離れるとレイアウトも失われます。Elementor サイトが移行時に何を引き継ぐかとDivi Builder との比較をご覧ください。Kadence と GeneratePress もブロックエディターでページを作り、そのブロックは無料プラグインで提供されます（Canvas と Kadence の比較、Canvas と GeneratePress の比較）。Blocksy はヘッダービルダーをカスタマイザーで管理します。
ヘッダービルダーとフッタービルダーは、テンプレートパーツとして表示されます
ヘッダー、フッター、トップバー、メガメニュー、サイドパネル、ページタイトルは、ブロックで構成されたレコードであり、テーマ独自のテンプレートパーツを通じてフロントエンドに表示されます。ヘッダーパーツはそのページに割り当てられたヘッダーを表示し、フッターパーツは割り当てられたフッターのレコードを表示します。そのため、サイトエディターでこれらを確認できる状態が保たれ、ブロックの設定もほかの場所と同じに保たれます。
- ヘッダービルダーに含まれる22種類のヘッダーブロックと94個のヘッダーオプション
- ヘッダーをサイト全体に割り当てたり、単一のページで個別に上書きしたりでき、フッター、トップバー、メガメニュー、サイドパネル、ページタイトルも同じ方法で設定できます
- ヒーローとスライダーもレコードであり、テンプレート内にあるスロットブロックによって配置されます。
- 両方のスロットブロックは編集キャンバスに表示されるため、ページを開くと訪問者が見るセクションをそのまま確認できます
24個のストアブロックと18個のストアテンプレート
WooCommerceは任意です。導入した場合も、ブロックとテンプレートで提供されるため、同期を保つ必要のあるテンプレートの上書きはありません。
ショップブロック
商品ページ、ショップグリッド、カート、チェックアウト用のブロックのほか、カラースウォッチや、ページの再読み込みなしでカートに追加する機能も含まれます。
ストアテンプレート
ショップ、商品、カート、チェックアウト、アカウントの各画面用テンプレート。ほかのテンプレートと同じく、サイトエディターで編集できます。
デモストア
88件のデモのうち21件は、商品、カテゴリー、属性、チェックアウトがそろった完全なストアとしてインポートされます。
21件のデモストアのうち2つ。ストア用ブロックとテンプレートで動作しています。
セットアップウィザードは、必要に応じて子テーマを作成します
子テーマは、Canvasのテンプレートファイルを直接編集する予定がある場合にのみ作成してください。アップデート時にも編集内容を守るのが子テーマの役割だからです。セットアップウィザードはデモのインポート前に専用のステップで子テーマを提案し、テーマフォルダーに作成して有効化します。その後もサイトの見た目は変わりません。ほとんどのサイトでは子テーマは不要です。一般的な理由は、現在では設定で対応できるためです。
- サイト全体のカスタムCSSと、ヘッダーおよびフッター用のカスタムJavaScriptを、テーマオプションのその他セクションで設定
- ブロックごとのカスタムCSS。セレクターは含めず、プロパティと値のペアとして記述します
- ブロックごとのカスタム属性。1行に1組ずつキーと値を入力します。data属性とaria属性に対応しています
- Typography セクションでの、任意のセレクター向けカスタムタイポグラフィルール
- 組み込みの4個パックと同じインターフェースを使って、独自のアイコンパックを登録します
- テーマオプションの設定一式をファイルとしてエクスポートし、次のサイトにインポートできます
Canvasに必要なもの、そして導入時にCanvasが行うこと
最低要件は目安ではなく、実際に必要な条件です。Canvas自身がホスト環境と照合して確認するため、インポートの失敗を初めて知ることにはなりません。
- Canvas Coreは別途ダウンロードするものではありません：ライセンスが有効になると、WordPress内からインストールされるため、管理すべきバージョンの組み合わせはありません
- アップデートは WordPress の更新画面に届き、メンテナンスモード、一時バックアップ、WordPress 自体からのロールバックにも対応しています
- 自動更新はパッチリリースのみを対象とし、初期状態でオンになっており、オフにするスイッチがあります。また、カスタマイズしたテンプレートを変更するリリースでは、その旨が記載されます
- ヘルスチェック画面では、お使いのホストに対してサーバー要件を実行し、対応が必要な項目を報告します。同じチェック項目は WordPress のサイトヘルスにも表示されます。
- すべての文字列が翻訳可能で、テーマとプラグインの翻訳テンプレートはリリースごとに再生成され、プラグインにはWPML設定ファイルが含まれています
- テクニカルSEO、XMLサイトマップ、16種類のスキーマタイプが、表示時にコンテンツから自動生成されます
技術面のよくある質問
開発者がプロジェクトへの採用前に確認する5つのポイントです。Canvasが対応しない項目も1つ含みます。
Canvasはブロックテーマですか、それともページビルダーテーマですか？
Canvasは、すべてがブロックで構成されたWordPressテーマです。WordPressではこれをブロックテーマと呼びます。テンプレートはWordPressのブロックテンプレート、テンプレートパーツはテンプレートパーツとして扱われ、色とタイポグラフィはtheme.jsonを通じて適用されます。編集はすべて、WordPressに標準で含まれるブロックエディターとサイトエディターで行います。別途インストールするビルダーも、覚える必要のある別のエディターも、更新が必要なビルダーのサブスクリプションもありません。
後からサイトのテーマを変更した場合、マークアップはどうなりますか？
データは標準のWordPressブロックのマークアップのまま保存されます。Canvasもこの形式で保存するためです。他のテーマが認識しないCanvasのブロックは、そのデザインの表示が止まりますが、見出し、段落、画像、リストはコアブロックなので、どこでも通常どおり表示されます。ショートコードや独自のレイアウト形式で保存されるものは一切ありません。
ヘッダーとフッターは実際にどこで描画されますか？
Canvasが登録するテンプレートパーツを通じて表示されます（全5種類：Header、Footer、Page Title、Sidebar、Sidebar Alt）。Headerパーツはページに割り当てられたヘッダーレコードを表示し、Footerパーツは割り当てられたフッターレコードを表示します。Page Titleパーツは、ページのページタイトル設定に従って解決される内容を表示します。パーツは仕組みを担うもので、デザインは22個のヘッダーブロックから構築するレコードで決まります。
子テーマは必要ですか？
Canvas のテンプレートファイルを直接編集する場合にのみ必要です。子テーマは、こうした編集をアップデートから保護する仕組みです。セットアップウィザードの任意ステップ「Child Theme」で子テーマを自動作成し、サイトを子テーマに切り替えることもできます。または、Canvas に含まれる子テーマのフォルダを、手動でテーマフォルダにコピーすることもできます。ほとんどのサイトでは必要ありません。サイト全体の設定はテーマオプションで行え、ブロック単位の設定はブロックごとの Custom CSS と Custom Attributes で対応できます。サイト全体の Custom CSS と JavaScript の欄は、テーマオプションの「Misc」セクションにあります。
Canvasは右から左に読む言語に対応したテーマですか？
はい、Canvasのすべてのスタイルシートには、左右反転させた右から左向けの版があります。サイトがアラビア語、ヘブライ語、ペルシャ語、その他の右から左に読む言語で運用されている場合、WordPressが自動的にそれを読み込みます。出荷前に、88件のデモのうち88件を右から左の表示で確認しているため、メニュー、グリッド、フォームは正しい側に配置されます。翻訳は別の話ですが、こちらも完全に対応しています。製品の両方に翻訳テンプレートが含まれ、WPML用の設定ファイルもプラグインに同梱されています。