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

更新日時 July 1, 2016

必要条件

ソフトウェア: HubSpot マーケティング
サブスクリプション: Basic, Pro, & Enterprise

サイトを設計しているときには、特定のページのセクションをサイト全体で再利用したくなることがあります。デザイナーやマーケターは、HubSpotを使用することにより、任意のテンプレートで再利用できるグローバルコンテンツを作成できます。

グローバルコンテンツは、コンテンツモジュールのグループと、ウェブサイトのページの重要な要素を構成する単一のコンテンツモジュールのいずれかで構成できます。グローバルコンテンツは、いったん作成したらサイト上のさまざまな場所に追加できるコンテンツです。

編集すると、グローバルモジュールまたはグループへの変更内容が、テンプレートでそのグローバルコンテンツを使用しているウェブサイトページすべてに反映されます。

手順

グローバルモジュールまたはグローバルグループを作成する手順は、以下のとおりです。

デザインマネージャーに移動

[Content(コンテンツ)] > [Design Manager(デザインマネージャー)]の順に進み、デザインマネージャーを起動します。編集したいテンプレートのレイアウトを開きます。
HubSpot Help article screenshot

コンテンツを設定

テンプレートのレイアウトを選択または作成した後、ギアアイコンをクリックし、[Edit Options(オプションを編集)]をクリックすると、任意のモジュールをカスタマイズできます。このリンクを使用すると、特定のモジュールタイプのデフォルトのコンテンツと使用可能なオプションをカスタマイズできます。

Edit-Options.png
グローバルグループを設定する場合、複数のモジュールのオプションを編集してから、それらをグループ化できます。 [Group..(グループ..)]ボタンをクリックし、グループ化したいモジュールを選択してから、[Create Group(グループを作成)]をクリックします。
Group-Modules.gif

グローバルにする

任意のモジュールのオプションを編集した後、モジュールの横にあるギアアイコンをクリックし、[Make Module Global(モジュールをグローバルにする)]オプションをクリックすることにより、このモジュールをグローバルにすることができます。
Make-Module-Global.png

グローバルグループの場合は、グループのギアをクリックし、[Make Module Global(モジュールをグローバルにする)]を選択します。グループをグローバルにすることを確定し、グローバルグループに名前を付けて保存します。

group_global.gif

グローバルモジュールまたはグループをテンプレートに追加

r

事例

ここでは、一般的なグローバルグループのいくつかの例を示します。
  • マストヘッド - マストヘッド(サイトヘッダー)は通常、ロゴ、ブランドスローガン、会社のコンタクト情報、メニュー、およびソーシャルの「Follow Me」アイコンなどの他の情報で構成されています。マストヘッドは通常、大部分のページで使用されますが、(メニューのないバリエーションが存在することがある)ランディングページは例外です。マストヘッドをモジュールのグループとして作成し、グローバルにすると、すべてのページのトップを統一しやすくなります。  
  • フッター - フッターには通常、有用なナビゲーションリンク、共有アイコン、著作権情報、および/またはサイトのプライバシーに関する情報が含まれます。フッターをモジュールのグループとして作成し、グローバルにすると、すべてのページのトップを統一しやすくなります。
  • サイドバー - CTAセクションなどの一部のサイドバーコンテンツをグローバルモジュールに配置すると、すべてのページにわたってオファーをスワップアウトしやすくなって便利な場合があります。
  • 埋め込みウィジェット - 動画、Twitterフィード、Googleマップ、音楽プレーヤー、または他の埋め込みオブジェクト用の埋め込みコードを使用してHTMLモジュールを作成する場合、複数のページにわたってそれらを使用できます。
続きを読む

モジュールまたはグループをグローバルにしたら、これを他のテンプレートに追加できます。 

グローバルモジュールまたはグローバルグループをテンプレートに追加するには、[Add row(行を追加)]をクリックし、テンプレートレイアウトの目的のエリアまでモジュールをドラッグします。

次に、モジュールのギアアイコンをクリックし、[Swap module(モジュールを交換)]を選択します。 モジュールのリストでグローバルモジュールまたはグループを探します。検索バーまたはフィルターを使用してフィルター処理すると、グローバルモジュールとグループのみを表示できます。 

Add-Global-Module.gif

グローバルコンテンツを管理

b

詳細情報

グローバルモジュールおよびグローバルグループは、コード化されたテンプレートに追加することもできます。このグローバルコンテンツはテンプレートレイアウトの一部として作成する必要がありますが、コード化されたファイルに含めることができます。

グローバルモジュールのHubLマークアップはここにありグローバルグループを含めるプロセスはこちらで説明しています。 

続きを読む

デザインマネージャーでのグローバルコンテンツの編集に加えて、グローバルコンテンツアプリを使用してグローバルコンテンツを管理することもできます。グローバルコンテンツアプリにアクセスするには、[Content Settings(コンテンツ設定)] > [Global Content(グローバルコンテンツ)]の順に移動します。

この画面で、フィルターを使用してグローバルモジュールとグローバルグループを切り替えることができます。

また、[Add new global module(新しいグローバルモジュールを追加)]をクリックして新しいグローバルモジュールを作成することもできます。

Global content screen
グローバルモジュールは、任意のテンプレートでローカルバージョンに戻すことができます。グローバルグループは複製して別のテンプレートに追加できますが、ローカルバージョンに変換することはできません。

前の記事

次の記事