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

サイト用の ウェブサイトページやランディングページ を作成して、オンラインプレゼンスを構築し、マーケティング活動を促進できます。ページのコンテンツや設定をカスタマイズしたり、検索エンジン向けにページを最適化したりして、コンテンツを適切なオーディエンスに確実に届けることができます。例えば、ランディングページはリードジェネレーションに不可欠であり、フォームを操作して訪問者の情報を取得できます。 

始める前に

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

必要条件を把握する

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

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

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

ページを作成する

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

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

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

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

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

1. • テンプレートをプレビューするには、テンプレートカードで [プレビュー]をクリックします。
   • 有効なテーマのテンプレートを使用するには、テンプレートカードで [使用 ]をクリックします。
   • テーマに含まれていないテンプレートを使用するには、左側のメニューで [その他 ]をクリックします。 

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

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

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

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

内部ページ名、ページタイトル、ページURL、メタディスクリプションなどのページ設定をカスタマイズできます。Marketing Hub ProfessionalまたはEnterpriseサブスクリプションをご利用のアカウントでは、ページをキャンペーンに関連付けることができます。

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

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

8. Marketing Hub ProfessionalまたはEnterpriseサブスクリプションをご利用の場合は、ページをキャンペーンに関連付けることができます。

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を入力してから［保存］をクリックします。 
  • ［スケジュール］をクリックします。