複数のテンプレートにわたってグローバルコンテンツを使用する方法

17 2月 2026

  • Hub  Article_product_key, Article_product_key
  • Content Hub  Article_product_key, Article_product_key, Article_product_key

グローバルコンテンツでは、ヘッダーやフッターなど、コンテンツのセクションを複数のページにわたって再利用できます。グローバルコンテンツが更新されると、そのグローバルモジュールまたはグローバルグループが使用される全ての場所に変更が適用されます。 

グローバルコンテンツはデザインマネージャーで作成・編集でき、コンテンツエディターから編集できます。 

始める前に

複数のテンプレートでグローバルコンテンツを使用する前に、次の要件と制限を確認してください。

以下の権限が必要です。

制限事項と考慮事項について

デザインマネージャーでグローバルコンテンツを作成する

グローバルコンテンツは、新しいモジュールとして作成することも、既存のモジュールまたはグループから変換することもできます。

グローバルモジュールを作成する

  1. ファインダーで、[ファイル]ドロップダウンメニューをクリックし、[新規ファイル]を選択します。
  2. ダイアログボックスで、[ 今日は何を作成しますか?]をクリックします。 ドロップダウンメニューをクリックし、[ モジュール]を選択して[次へ]をクリックします
  3. [ このモジュールをどこで使用しますか? セクションで、このグローバルモジュールを使用する各コンテンツのタイプの横にある チェックボックスをオンにします 。Eメールに使用されるグローバルモジュールにCSSやJavascriptを含めることはできません。
  4. [モジュールコンテンツ範囲]セクションで、[ グローバルモジュール]を選択します。
  5. ファイル名を入力し 、[ 作成]をクリックします
  6. モジュールエディターで、 モジュールの編集を続けます。

既存のローカルモジュールまたはグループを変換

  1. ファインダーでテンプレートをクリックして内容 を編集します。
  2. グローバルグループを作成する場合は、複数のモジュールのオプションを編集できます。Control キー/ Commandキーを押し、グループ化する モジュール をクリックしてから、 インスペクターーで groupModuleグループアイコンをクリックします
  3. モジュール または モジュールグループ をクリックして、レイアウトエディターで選択します。
  4. インスペクターーで [その他 ]ドロップダウンメニューをクリックし、[ グローバルモジュールに変換]/[グローバルグループに変換]を選択します。

グローバルモジュールまたはグローバルグループをドラッグ&ドロップテンプレートに追加する

  1. ファインダーで、ドラッグ&ドロップ テンプレート をクリックして内容を編集します。
  2. インスペクターで、[+追加]をクリックします。
  3. 検索]フィールドにテキストを入力するか、[カテゴリーまたはタグによる絞り込み]ドロップダウンメニューをクリックして、グローバルモジュール/グループを見つけます。
  4. 追加したい グローバルモジュールまたはグローバルグループ をクリックし、テンプレートレイアウトの中にドラッグします。
  5. 完了したら、右上の [公開 ]をクリックします。

コードテンプレートでグローバルコンテンツを使用する

コードテンプレートには、[ グローバルモジュールに変換] オプションは含まれません。代わりに、グローバルモジュールを手動で作成して参照する必要があります。

  1. ファインダーで、[ ファイル ]ドロップダウンメニューをクリックし、[ 新規ファイル]を選択します。
  2. ダイアログボックスで、[ 今日は何を作成しますか?]をクリックします。 ドロップダウンメニューをクリックし、[ モジュール]を選択して[次へ]をクリックします
  3. [モジュールコンテンツ範囲]セクションで、[ グローバルモジュール]を選択します。
  4. ファイル名を入力し 、[ 作成]をクリックします
  5. 元のモジュールに一致する必須フィールドを作成してください。 
  6. モジュールの HubLスニペットをコピーします。 
  7. グローバルモジュールを参照するように HubLスニペット をコードテンプレートに貼り付けます。
  8. 完了したら、右上の [公開 ]をクリックします。

:開発者は、テンプレートを更新してそのモジュールを使用する前に、CLIを使用してモジュールを複製し、複製されたモジュールの meta.json ファイルに "global": true を設定することもできます。詳しくは、開発者ドキュメントをご覧ください。

コンテンツエディターでグローバルコンテンツを編集する

グローバルコンテンツは、 コンテンツエディターでページや投稿から直接編集できます。更新は、同じグローバルモジュールまたはグループを使用しているすべてのアセットに適用されます。

  1. 目的のコンテンツに移動します。

    • ウェブサイトページ
    • ランディングページ
    • ブログ
  2. コンテンツの名前をクリックします。
  3. コンテンツエディターでsiteTreeIconコンテンツアイコンをクリックした後、グローバルモジュールのglobalGroupグローバル コンテンツ アイコンをクリックします。 
  4. 表示されるダイアログボックスで、[グローバル コンテンツ エディターで開く]をクリックします。
  5. グローバル コンテンツ エディターで siteTreeIcon コンテンツ アイコン をクリックし、 ドラッグ&ドロップツールを使用してグローバルグループ内のモジュールを編集します。
  6. 以前にロゴを追加していない場合は、ロゴモジュールのグローバルヘッダーにロゴを追加できます。ブランディングの設定について詳細をご確認ください。ロゴを追加するには、 ロゴ モジュールをクリックし、 次に[ブランド設定]をクリックします。
    • ダイアログボックスで[ 追加]をクリックします。
    • [ アップロード ]をクリックしてパソコンからイメージをアップロードするか、[ 画像を参照 ]をクリックしてファイルツールから画像を選択します。
    • [ロゴ名]フィールドにロゴの名前を入力するためのテキストを入力してください。
    • [ロゴのaltテキスト]フィールドと[ロゴのURL]フィールドにテキストを入力します。
    • 完了したら、[保存]をクリックします。次に、[ [#]アセットに公開]をクリックします。
  7. ナビゲーションメニューを編集するには、モジュールをクリックします。サイドバーエディターで、メニューの[編集]をクリックします。ダイアログボックスで、 引き続きナビゲーションメニューをカスタマイズします。
  8. 既存のページや記事でグローバルコンテンツをプレビューするには、左上の[ 表示場所 ]ドロップダウンメニューをクリックし、グローバルコンテンツを表示する ページ記事 を選択します。グローバルコンテンツを単独で表示するには、代わりに[グループのみ]を選択します。
  9. 多言語バージョンのグローバルコンテンツを作成するには、左上の [言語 ]ドロップダウンメニューをクリックし、[ 多言語バリエーションを追加/編集]を選択します。多言語グローバルコンテンツの作成について詳細をご確認ください。

  1. 完了したら、右上の[[X]件のアセットに公開]をクリックします。これらの変更は、グローバルコンテンツを含むテンプレートを使用しているすべてのページと記事に適用されます。

デザインマネージャーでグローバルコンテンツを編集する

開発者はデザインマネージャーでグローバルモジュール/グループを編集できます。グローバルコンテンツの変更内容は、同じグローバルコンテンツが入っているテンプレートを使用する全てのコンテンツに適用されます。

  1. ファインダーでテンプレートをクリックして内容 を編集します。
  2. 特定のページ、ブログ記事、またはEメールのみを対象にグローバルコンテンツのコンテンツを編集するには、グローバルコンテンツの ローカルコピーを作成して デザインマネージャーで編集できます。
  3. レイアウトエディターでグローバルグループを編集するには、テンプレートのグローバル グループ をクリックします。インスペクターで[ その他 ]ドロップダウンメニューをクリックし、[ グローバルグループを編集]を選択します。 
  1. 完了したら、[ 変更を公開]をクリックします。
Was this article helpful?
This form is used for documentation feedback only. Learn how to get help with HubSpot.