ページを作成し、カスタマイズする

ウェブサイトとランディングページ を作成してオンラインプレゼンス(存在感)を構築し、マーケティング活動を促進します。 HubSpotのBreeze を使用して、ページの目的、訪問者にとっての目標、最適顧客プロファイル(ICP)を説明するプロンプトを入力することで、パーソナライズされたランディングページを生成できます。 

ページのコンテンツや設定をカスタマイズし、検索エンジン向けにページを最適化して、コンテンツを適切なオーディエンスに確実に届けましょう。 

注：AI機能の有効なデータ入力では、プロンプトを含め機密情報を共有しないでください。管理者はアカウント管理設定で生成AI機能を設定できます。HubSpot AIがお客さまのデータを利用して信頼性の高いAIを提供し、お客さまがご自身のデータを管理する方法については、HubSpot AI Trustに関するよくある質問（FAQ）をご覧ください。

始める前に

この機能を使い始める前に、あらかじめ必要となる手順と、この機能の使用に伴う制限事項と潜在的な結果について十分に理解しておいてください。 

要件を理解する

• 作成するページタイプの 「編集」権限 があることを確かめます。ページを公開するには、「 公開」権限も必要になります。 

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

• 公開用の ドメインがHubSpotに接続されている ことを確かめてください。HubSpotの無料ツールを使用する場合は、公開に利用可能なHubSpotブランドのドメインがアカウントに含まれています。
• 利用可能な各種のページテンプレートについて理解します。
  
  • テーマテンプレート では、 ドラッグ&ドロップ操作による編集 機能、専用のテーマモジュール、 カスタマイズ可能なテーマのスタイル設定を使用できます。
  • カスタムテンプレートは、デザインマネージャー内で レイアウトエディターまたは カスタムコードのいずれかを使って作成します。ドラッグ&ドロップ編集機能は、 ドラッグ&ドロップエリアのあるカスタムテンプレートでのみ使用できます。 

ページを作成する

コンテンツエディターで、有効なテーマのテンプレートを使用してページを作成します。ページのテーマを変更したり、テーマを編集したり、他のテンプレートを使用したりすることもできます。 

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

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページを自社のブランドと一致させるには、ページ上部の[ ブランドキットをセットアップ ]をクリックします。
   • ダイアログボックスで、[ ロゴ]、[ ファビコン]、 および[色]の横にある [追加 ]をクリックします。
   • [保存] を選択して、各オプションの変更を適用します。 
   • 完了したら、［X］をクリックしてダイアログボックスを閉じます。会社のブランディングのカスタマイズについて詳細をご確認ください。

3. 右上の[ 作成]または[ランディングページを作成]をクリックします。 既存のページがある場合。既存のページがない場合は、[ 始める]または[ゼロから始める]をクリックします。
   
   • 既存のページがある場合は、[ テンプレートを選択 ]ページが表示されます。
   • 初めてページを作成する場合は、 テンプレートを選択する前に[ テーマを選択 ]ページが表示されます。テーマを選択するには、 テーマ の上にマウスポインターを置き、[ 有効なテーマに設定]をクリックします。
4. テンプレート の選択 ページでは、次の操作を行うことができます。

1. • テーマを変更するには、左上の [検索 ]フィールドの下にあるテーマ の名前 をクリックします(例: 「テーマ: Elevate」)。
     • [テーマ ]ページで、テーマカードの[ 有効なテーマに設定 ]をクリックします。 
     • [ テンプレートを選択 ]ページに戻ります。
   • テーマをプレビューするには、[ 検索 ]フィールドの下にあるテーマ の名前 をクリックします(例: 「テーマ」: Elevate)。
     • [テーマ]ページで、テーマカードの [プレビュー ]をクリックします。
     • プレビューで、[ テンプレート ]ドロップダウンメニューをクリックし、テーマを表示する テンプレート を選択します。
     • テーマのプレビューが完了したら、右上の [有効なテーマに設定 ]をクリックするか、左上の [戻る ]をクリックします。

1. • テンプレートをプレビューするには、テンプレートカードで [プレビュー]をクリックします。
   • 有効なテーマのテンプレートを使用するには、テンプレートカードで [使用 ]をクリックします。ランディングページを作成する場合は、テンプレートを選択した後に[ 手動で編集 ]または[ AIを利用して生成]をクリックします。
   • テーマに含まれていないテンプレートを使用するには、左側のメニューで [その他 ]をクリックします。 

5. コンテンツエディターの編集オプションは、使用しているページのテンプレートタイプやモジュールによって異なります。テーマテンプレート、複数のページにまたがる グローバルコンテンツ 、 ドラッグ&ドロップエリア、 リッチ テキスト モジュールや 画像 モジュールを使ったページの編集について詳細をご確認ください。

Breezeでランディングページを生成

HubSpotのBreeze を使用すれば、目標に応じたランディングページを生成できます。ページの目的のプロンプトを記述すると、エージェントがコンテンツの提案(コピー、画像、自動フォーム、ミーティングリンクなど)を生成します。

1. HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページとブランドを一致させます。
3. 右上の[ ランディングページを作成]をクリックします。
   • 既存のページがある場合は、[ テンプレートを選択 ]ページが表示されます。
   • 初めてページを作成する場合は、 テンプレートを選択する前に[ テーマを選択 ]ページが表示されます。テーマを選択するには、 テーマ の上にマウスポインターを置き、[ 有効なテーマに設定]をクリックします。
4. テンプレートを選択します。
5. テンプレートを選択したら、右上の[ AIを利用して生成 ]をクリックします。[ コンテンツを生成 ]ページが表示されます。 
6. [ ページについて ]セクションには、ランディングページ の説明を入力します。ランディングページの目的、ターゲットオーディエンス、主要なコンテンツ、トーン、メッセージを含めます。こちらの例を使用して詳細をご確認ください。

7. [訪問者の目標 ]フィールドの オプション (例:[ ミーティングを予約])をクリックします。 
8. 画像の生成をスキップするには、[ 画像の生成をスキップ ]チェックボックスをオンにします。 
9. サポートファイルを追加するには、[ファイルをアップロード ]をクリックしてデバイスからファイルを追加するか、[参照]をクリックして ファイルツールからファイルを選択します。最大5個のファイル(画像、動画、文字起こしなど)を追加して、ランディングページのコンテンツを改善できます。 

10. [会社 ]セクションで、[ 業種 ]ドロップダウンメニューをクリックし、コンテンツに含める 業種 を選択します。
11. [オーディエンス ]セクションで、[ コンテンツの言語 ]ドロップダウンをクリックし、コンテンツの 言語 を選択します。
12. [最適顧客プロファイル(ICP)] ドロップダウンメニューをクリックし、 理想的な顧客を選択します。最適顧客プロファイル(ICP)を管理するには、[ settingsIcon 設定]アイコンをクリックし、[ 管理]を選択します。
13. [ ドメイン ]ドロップダウンメニューをクリックし、ランディングページを公開する ドメイン を選択します。
14. 最後の セクション(任意)では、選択された [訪問者の目標 ]フィールドに基づいてさらに詳細が必要な場合があります。例えば、[目標として「ミーティング を予約 」を選択した場合、[ ミーティングリンク]ドロップダウンメニューをクリックし、 ミーティングリンクを選択します。
15. 完了したら、右上の[ Generate with Breeze ]をクリックします。 
16. Breeze でランディングページが生成されたら、 コンテンツエディター に移動してページのカスタマイズを続けます。

例

Breezeを使用してランディングページを生成するには、次の詳細の例を使用します。

1. HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. [ ランディングページを作成]をクリックします。
3. [テンプレートを選択]ページで、テンプレートカード で[使用 ]をクリックします。次に、右上の[ AIを利用して生成 ]をクリックします。
4. [コンテンツの生成 ]ページで、[ページを説明 ]フィールドに次の テキスト を入力します。

既存顧客向けのランディングページを作成し、訪問者に営業担当とのミーティングを予約するよう促します。1対1のミーティングが、現在のツールを最適化し、サブスクリプションからさらなる価値を引き出すのにどのように役立つかを明確に伝える必要があります。Eメールによるナーチャリングキャンペーンからの訪問者に対して、フレンドリーで専門的な口調を使用し、自信を醸成する.

追加のオプションを含める:
ページの上部に顧客価値の簡単な概要を追加します
ファーストビューにスケジュール設定CTAを追加します。
担当者とミーティングすることの3つのメリットを概説するセクションを含めます。
既存顧客からの推薦コメントを追加します
ミーティングの内容に関する簡単なFAQを追加します。

5. [ 訪問者の目標 ]フィールドで[ ミーティングを予約 ]オプションをクリックします。
6. [ 画像の生成をスキップ] チェックボックスをオンにします。 
7. 会社 セクションで、業種 フィールドの SaaS を選択します。
8. [オーディエンス]セクションで最適顧客プロファイル(ICP)をクリックし、任意の オプションを選択します。新しいオプションを追加するには、[ settingsIcon 設定]アイコンをクリックし、[管理]を選択します。
9. ［ドメイン］ドロップダウンメニューをクリックし、ドメインを選択します。
10. [ ミーティングの詳細(任意)] セクションで、[ ミーティングリンク ]ドロップダウンメニューをクリックし、ミーティングリンクを選択します。
11. 完了したら、右上の[ Generate with Breeze ]をクリックします。 
12. Breeze でランディングページが生成されたら、 コンテンツエディター に移動してページのカスタマイズを続けます。

ページの設定をカスタマイズする

ページのコンテンツを編集したら、URL、メタディスクリプション、言語などのページ属性をカスタマイズできます。 

基本的なページ設定をカスタマイズする

内部ページ名、ページタイトル、ページURL、メタディスクリプションを含めて、ページ設定をカスタマイズできます。ページをキャンペーンに関連付けることもできます。

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

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページの名前をクリックします。 
3. コンテンツエディターで、右上の［設定］をクリックします。 
4. 表示されるダイアログボックスで、［内部ページ名］フィールドに内部名を入力します。この名前は訪問者には表示されません。 
5. ［ページタイトル］フィールドに、ページの外部名を入力します。この名前は、ページが読み込まれると、訪問者のウェブブラウザーの最上部にあるタブに表示されます。 
6. ［ページURL］セクションで、［ドメイン］ドロップダウンメニューをクリックし、ページをホスティングするドメインを選択します。次に、［コンテンツスラッグ］フィールドにURLスラッグを入力します。詳しくは、ページのURLの編集をご確認ください。 
7. ［メタディスクリプション］フィールドに、検索結果に表示されるページのコンテンツの説明を入力します。AIを使用してディスクリプションを改良するには、artificialIntelligenceIcon Breezeアイコンをクリックします。Breezeを使用したメタディスクリプションの生成について詳細をご確認ください。 

8. ページをキャンペーンに関連付けるには、次の手順に従います。

1. • ページを既存のキャンペーンに関連付けるには、［キャンペーン］ドロップダウンメニューをクリックし、キャンペーンを選択します。
   • ページを最初のキャンペーンまたは新しいキャンペーンに関連付けるには、[ キャンペーン ]ドロップダウンメニューをクリックし、[ キャンペーンを作成]をクリックします。続けて、キャンペーンを設定します。 

キービジュアルを設定する

ソーシャルメディアでページが共有されると表示されるキービジュアルを追加するには、次の手順に従います。

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

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページの名前をクリックします。 
3. コンテンツエディターで、右上の［設定］をクリックします。
4. ダイアログボックスで、左側のメニューの[ キービジュアル]を選択します。
5. [ Enable featured image (画像を有効にする)]スイッチをオンに切り替えます。
6. ［アップロード］をクリックしてご使用のコンピューターから画像を選択するか、［画像を参照］をクリックしてファイルツールから画像を選択します。
7. アクセシビリティーを高めるには、[画像の代替テキスト ]フィールドに画像 の説明 を入力します。

ページテンプレートを変更する

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

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページの名前をクリックします。 
3. コンテンツエディターで、右上の［設定］をクリックします。
4. ダイアログボックスで、左側のメニューの[ テンプレート]を選択します。
5. 別のテンプレートを選択するには、［別のテンプレートを使用］をクリックします。公開中のページのテンプレートを切り替える場合は、未公開の変更を反映させるために、必ず［更新］をクリックしてください。この操作を行わないと、テンプレートの切り替え時に変更が失われる可能性があります。
6. [ テンプレートの選択] ページで、 テンプレートを選択します。
7. テーマを変更するには、［テーマ］ドロップダウンメニューをクリックし、［テーマを変更］を選択します。 
   • [ テーマを選択 ]ページで、新しい テーマを選択します。
   • HubSpotマーケットプレイスのテーマを使用するには、[ マーケットプレイスでテーマを表示]をクリックします。HubSpotマーケットプレイスからテーマをインストールする方法をご確認ください。 
8. 新しいテンプレートでページがどのように表示されるかを確認するには、[プレビュー]をクリックします 。次に、[ テンプレートを使用] をクリックしてテンプレートの切り替えを完了するか、[ 戻る ]をクリックして別のテンプレートを選択します。 

ページの言語を設定する

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

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページの名前をクリックします。 
3. コンテンツエディターで、右上の［設定］をクリックします。
4. ダイアログボックスで、左側のメニューの [言語]を選択します。
5. ［ページ言語］ドロップダウンメニューをクリックして言語を選択します。多言語ページの管理について詳細をご確認ください。 

ページの表示範囲を設定する

ページの表示範囲は、ページ設定内の［オーディエンスアクセス］メニューで設定できます。

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

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページの名前をクリックします。 
3. コンテンツエディターで、右上の［設定］をクリックします。
4. ダイアログボックスで、左側のメニューの [オーディエンスアクセス]を選択します。
5. [アクセス制御 ]セクションで、 オーディエンスアクセス オプションを選択します。 
   • ［公開］を選択すると、全ての訪問者がページのコンテンツを閲覧できるようになります。
   • 訪問者がページコンテンツにアクセスするために必須となるパスワードを追加するには、［パスワードが必要］を選択します。
   • Content Hub Enterprise をご利用の場合は、[ アクセスグループメンバーシップが必要です]を選択して、このコンテンツの表示に際し、 訪問者にサイトへの登録 を求めることもできます。 
   • Content Hub Enterprise のアカウントでは、[シングルサインオン(SSO)を必須にする]を選択して、GoogleやOktaなどの IDプロバイダーを使用したサインインを訪問者に求めることができます。 

ページの詳細オプションを設定する

ページを動的ページにする、ヘッダーHTMLやフッターHTMLのコードスニペットを追加するなど、ページの高度なオプションを設定できます。ページのさまざまなスタイルシートを管理することもできます。

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

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページの名前をクリックします。 
3. コンテンツエディターで、右上の［設定］をクリックします。
4. ダイアログボックスで、左側のメニューの [詳細設定]を選択します。
5. このページを動的なページにするには、表示されるダイアログボックスで［データソース］ドロップダウンメニューをクリックし、HubDBテーブルまたはプロパティーを選択します。詳しくは、動的ページの使い方をご確認ください。 
6. ページのヘッダーまたはフッターにコードスニペットを追加するには、[ ヘッダーHTML ]フィールドまたは [フッターHTML ]フィールドに コードスニペット を入力します。ドメイン内の全てのページにコードスニペットを追加するには、ウェブサイト設定にアクセスします。
7. カスタムのcanonical URLを追加するには、［canonical URLをカスタマイズ］フィールドにURLを入力します。正規URLを使用する方法について詳細をご確認ください。
8. ページに関連付けられたさまざまなタイプのスタイルシートを管理します。 
   • ドメインスタイルシート：これらのスタイルシートは、ウェブサイト設定で指定されている1つのドメイン上の全てのページに関連付けられます。特定のページについてドメインスタイルシートをオフにするには、ドロップダウンメニューをクリックし、［無効］を選択します。ドメインスタイルシートの使い方について詳細をご確認ください。
   • テンプレートスタイルシート：これらのスタイルシートは、ページのテンプレートで設定されます。特定のページについてテンプレートスタイルシートをオフにするには、ドロップダウンメニューをクリックし、［無効］を選択します。このセクションは、テーマテンプレートを使用しているページには表示されません。 
   • ページスタイルシート：これらのスタイルシートは、当該ページだけに適用されます。ページスタイルシートを関連付けるには、［スタイルシートを添付］ドロップダウンメニューをクリックし、関連付けるスタイルシートを選択します。ドメインスタイルシートやテンプレートスタイルシートも使用されている場合は、そのスタイルが優先されます。 

検索エンジン向けにページを最適化する

サイドバーエディターの［最適化］セクションで、ページのSEO推奨を表示したり、ページをトピックに関連付けしたりできます。 

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

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページの名前をクリックします。 
3. コンテンツエディターで、左のサイドバーにあるgauge ［最適化］アイコンをクリックします。 
4. コンテンツをトピックに関連付けるには、次のようにします。 
   • 既存のトピックを追加するには、[ コア トピック]ドロップダウンメニューをクリックし、ページのトピックを選択します。
   • 新しいトピックを作成するには、[ コア トピック]ドロップダウンメニューをクリックし、[コアトピックを追加]を選択します。表示されるダイアログボックスで、トピックを入力してから［保存］をクリックします。
5. ページをサブトピックキーワードに関連付けるには、次のようにします。
   • ［これはサポートコンテンツですか？］チェックボックスを選択します。
   • ［サブトピックキーワード］ドロップダウンメニューをクリックし、サブトピックキーワードを選択します。
   • 新しいキーワードを作成するには、［サブトピックキーワード］ドロップダウンメニューをクリックし、［サブトピックキーワードを追加］をクリックします。表示されるダイアログボックスで、サブトピックキーワードを入力してから［保存］をクリックします。 

6. 未完了のSEO推奨を表示するには、赤い枠で囲まれたカテゴリーをクリックします。完了した各推奨事項には緑のチェックマークが付きます。未完了の各推奨にはグレーのチェックマークが付きます。SEO推奨を利用する方法について詳細をご確認ください。 

ページをプレビューする

ページを公開する前に、さまざまな デバイスタイプ でのプレビューや、スマートコンテンツとパーソナライズのテストを行うことができます。プレビューリンクは、アカウント内の他のユーザーと内部で共有するように設計されています。外部の訪問者と共有することは推奨されません。 

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

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページの名前をクリックします。 
3. コンテンツエディターで、右上の［プレビュー］をクリックします。 
4. ページを全画面表示でプレビューするには、右上の［新しいタブで開く］をクリックします。このプレビューページをご使用のアカウントのユーザーと共有するには、プレビューページで［リンクをコピー］をクリックします。ページがHubSpotシステムドメインでホスティングされている場合、ユーザーがこのプレビューを表示するには、HubSpotにログインする必要があります。
5. 別のデバイスでのプレビューを行うには、プレビューページの右上にあるmobileデバイスアイコンをクリックします。 

6. パーソナル化やスマートコンテンツをプレビューするには、［プレビュー動作］ドロップダウンメニューをクリックします。 
   • クリック を選択すると、ページの パーソナライズをプレビューできます。次に、2つ目のドロップダウンメニューをクリックし、特定のコンタクトを選択すると、そのコンタクトに対してページがどのように表示されるかをプレビューできます。 
   • ページの スマートコンテンツをプレビューするにはスマートルール を選択します。次に、2つ目のドロップダウンメニューをクリックし、1つ以上のスマートルールを選択すると、そのルールに適合した訪問者に対してページがどのように表示されるかをプレビューできます。
   • ページをデフォルトの外観に戻すには、［リセット］をクリックします。

ページを公開する

ページのコンテンツと設定をカスタマイズした後、ページをすぐに公開することも、後でページを公開するようにスケジュールすることもできます。

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

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページの名前をクリックします。 
3. ページをすぐに公開するには、右上の［公開］をクリックします。
4. 後でページを公開するようにスケジュールするには、次のようにします。 
   • 右上の［公開］ボタンの隣にあるドロップダウンメニューをクリックし、［スケジュール設定オプション］を選択します。
   • 表示されるダイアログボックスで、［公開をスケジュール］をクリックします。 

• • ［日付］フィールドをクリックし、ページを公開する日付を選択します。 
  • ［時刻］フィールドをクリックし、ページを公開する時刻を選択します。 

• • ［スケジュール］をクリックします。これにより、ページに加えた全ての変更が、スケジュール済みの公開に含まれます。

5. 特定の時期が来たら自動的にページを非公開にするには、次のようにします。
   • 右上の［公開］ボタンの隣にあるドロップダウンメニューをクリックし、［スケジュール設定オプション］を選択します。

• • 表示されるダイアログボックスで、［公開終了スケジュールを設定］タブをクリックします。 
  • ［公開終了スケジュールを設定］をクリックします。 
  • ［日付］フィールドをクリックし、ページの公開を終了する日付を選択します。 
  • ［時刻］フィールドをクリックし、ページの公開を終了する時刻を選択します。 
  • ［ページの公開が終了になると、訪問者を次の場所へリダイレクト（転送）］ドロップダウンメニューをクリックし、リダイレクト先のページを選択します。外部のリダイレクト先URLを使用するには、［外部URLを入力］をクリックし、URLを入力してから［保存］をクリックします。 
  • ［スケジュール］をクリックします。