メインコンテンツにスキップ
お客さまへの大切なお知らせ:膨大なサポート情報を少しでも早くお客さまにお届けするため、本コンテンツの日本語版は人間の翻訳者を介さない自動翻訳で提供されております。正確な最新情報については本コンテンツの英語版をご覧ください。

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

更新日時 2024年 3月 12日

以下の 製品でご利用いただけます(別途記載されている場合を除きます)。

すべての製品とプラン

HubSpotでは、ウェブサイトのページとランディングページを作成できます。ページのコンテンツや設定をカスタマイズしたり、検索エンジン向けにページを最適化したりできます。 

準備

  • 作成したいページのタイプに対して、Writeの権限があることを確認してください。ページを公開するには、「公開」権限も必要です。 
  • ドメインがHubSpotに接続されていることを確認してください。HubSpotの無料ツールを使用する場合は、公開に利用可能なHubSpotブランドのドメインがアカウントに含まれています。
  • HubSpot上で利用可能なさまざまなタイプのページテンプレートについて確認します。 
  • 作成できるランディングページやウェブサイトページの数と、使用可能なテンプレートをご確認ください。作成可能なページ数と使用できるテンプレートは、Marketing HubおよびCMS Hubのご契約内容に応じて決まります。 
  Marketing Hubのご契約なし Marketing Hub Starter Marketing Hub Professional/Enterprise  

 

CMS Hubのご契約なし

ランディングページ:20ページまで(HubSpotロゴあり)、スターターテンプレートのみ

ウェブサイトページ:25ページまで(HubSpotロゴあり)、全てのテンプレート

ランディングページ:10,000ページまで、スターターテンプレートのみ

ウェブサイトページ:25ページまで(HubSpotロゴあり)、全てのテンプレート

ランディングページ:10,000ページまで、全てのテンプレート 

ウェブサイトページ:25ページまで(HubSpotロゴあり)、全てのテンプレート

 

 

CMS Hub Starter

ランディングページ:20ページまで(HubSpotロゴあり)、スターターテンプレートのみ

ウェブサイトページ:50ページまで、全てのテンプレート

ランディングページ:10,000ページまで、スターターテンプレートのみ

ウェブサイトページ:50ページまで、全てのテンプレート

ランディングページ:10,000ページまで、全てのテンプレート

ウェブサイトページ:50ページまで、全てのテンプレート

 

 

CMS Hub Professional/Enterprise

ランディングページ:10,000ページまで、全てのテンプレート

ウェブサイトページ:10,000ページまで、全てのテンプレート

ランディングページ:10,000ページまで、全てのテンプレート

ウェブサイトページ:10,000ページまで、全てのテンプレート

ランディングページ:10,000ページまで、全てのテンプレート

ウェブサイトページ:10,000ページまで、全てのテンプレート 

 

ページを作成する

  • コンテンツを開きます。

    • ウェブサイトページ:HubSpotアカウントにて、[マーケティング]>[ウェブサイト]>[ウェブサイトページ]の順に進みます。
    • ランディングページ:HubSpotアカウントにて、[マーケティング]>[ランディングページ]の順に進みます。
  • 右上の[作成]ドロップダウンメニューをクリックし、ウェブサイトページまたはランディングページを選択します。
  • ダイアログボックスで、ページの名前とドメインを指定します。 

create-a-page-dialog-box

  • テンプレート選択画面では、自分のアクティブテーマのテンプレートがページの上部に表示され、それ以外の全てのテンプレートはその他のテンプレートセクションの下部に表示されます。有効なテーマを選択していない場合は、テーマにカーソルを合わせ、[有効なテーマに設定]をクリックします。
  • テンプレートにカーソルを合わせ、[テンプレートをプレビュー]をクリックしてプレビューを開くか、[テンプレートを選択]をクリックしてコンテンツエディターに進みます。

テンプレートをプレビューまたは選択

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

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

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

  • コンテンツを開きます。

    • ウェブサイトページ:HubSpotアカウントにて、[マーケティング]>[ウェブサイト]>[ウェブサイトページ]の順に進みます。
    • ランディングページ:HubSpotアカウントにて、[マーケティング]>[ランディングページ]の順に進みます。
  • ページの上にカーソルを重ねて[編集]をクリックします。 
  • [設定]メニューをクリックし、[全般]を選択します。 
  • ダイアログボックスの[内部ページ名]フィールドに内部名を入力します。この名前は訪問者には表示されません。 
  • [ページタイトル]フィールドに、ページの外部名を入力します。この名前は、ページが読み込まれると、訪問者のウェブブラウザーの最上部にあるタブに表示されます。 
  • [ページURL]セクションで、[ドメイン]ドロップダウンメニューをクリックし、ページをホスティングするドメインを選択します。次に、[コンテンツスラッグ]フィールドにURLスラッグを入力します。詳しくは、ページのURLの編集をご確認ください。 
  • [メタディスクリプション]フィールドに、検索結果でページタイトルの下に表示される、ページのコンテンツの説明を入力します。 
  • Marketing Hub ProfessionalまたはEnterpriseの配信登録ページをお持ちの場合、ページをキャンペーンに関連付けることができます:
    • ページを既存のキャンペーンに関連付けするには、キャンペーンドロップダウンメニューをクリックし、キャンペーンを選択します。
    • ページを新規キャンペーンに関連付けるには、キャンペーンドロップダウンメニューをクリックし、キャンペーンを作成をクリックします。続けて、キャンペーンを設定します。 
    • キャンペーンを作成したことがない場合は、[キャンペーンを作成]をクリックします。続けて、キャンペーンを設定します。 

edit-page-info-in-page-settings

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

ソーシャルメディアでページがシェアされる場合に表示するキービジュアルを追加するには:

  • コンテンツを開きます。

    • ウェブサイトページ:HubSpotアカウントにて、[マーケティング]>[ウェブサイト]>[ウェブサイトページ]の順に進みます。
    • ランディングページ:HubSpotアカウントにて、[マーケティング]>[ランディングページ]の順に進みます。
  • ページの上にカーソルを重ねて[編集]をクリックします。 
  • [設定]メニューをクリックし、[キービジュアル]を選択します。
  • ダイアログボックスで、[キービジュアルを有効にする]スイッチをクリックしてオンに切り替えます。
  • [アップロード]をクリックしてご使用のコンピューターから画像を選択するか、[画像を参照]をクリックしてファイルツールで画像を選択します。
  • アクセシビリティーを高めるには、[画像のaltテキスト]フィールドに画像の説明を入力します。

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

  • コンテンツを開きます。

    • ウェブサイトページ:HubSpotアカウントにて、[マーケティング]>[ウェブサイト]>[ウェブサイトページ]の順に進みます。
    • ランディングページ:HubSpotアカウントにて、[マーケティング]>[ランディングページ]の順に進みます。
  • ページの上にカーソルを重ねて[編集]をクリックします。 
  • [設定]メニューをクリックし、[テンプレート]を選択します。
  • ダイアログボックスで、別のテンプレートを選択するには[別のテンプレートを使用]をクリックします。公開中のページのテンプレートを切り替える場合は、未公開の変更を反映させるために必ず[更新]をクリックしてください。この操作を行わないと、テンプレートの切り替え時に変更が失われる可能性があります。
  • テーマ選択画面で、テーマを選択します。
  • テンプレート選択画面で、テンプレートを選択します。
  • 新しいテンプレートを使ったページの表示をプレビューしたら、[テンプレートを使用]をクリックしてテンプレートの切り替えを完了するか、[戻る]をクリックして別のテンプレートを選択します。 

ページ言語を設定する

  • コンテンツを開きます。

    • ウェブサイトページ:HubSpotアカウントにて、[マーケティング]>[ウェブサイト]>[ウェブサイトページ]の順に進みます。
    • ランディングページ:HubSpotアカウントにて、[マーケティング]>[ランディングページ]の順に進みます。
  • ページの上にカーソルを重ねて[編集]をクリックします。 
  • [設定]メニューをクリックし、[言語]を選択します。
  • ダイアログボックスで、[ページ言語]ドロップダウンメニューをクリックし、言語を選択します。詳しくは、多言語ページの管理をご確認ください。 

ページの可視性を設定する

  • コンテンツを開きます。

    • ウェブサイトページ:HubSpotアカウントにて、[マーケティング]>[ウェブサイト]>[ウェブサイトページ]の順に進みます。
    • ランディングページ:HubSpotアカウントにて、[マーケティング]>[ランディングページ]の順に進みます。
  • ページの上にカーソルを重ねて[編集]をクリックします。 
  • コンテンツエディターで[設定]メニューをクリックし、[オーディエンスアクセス]を選択します。
  • ダイアログボックスで、オーディエンス アクセス オプションを選択します。 
    • どの訪問者でもページのコンテンツを閲覧できるようにするには、[公開]を選択します。
    • 訪問者がページコンテンツにアクセスするために必須となるパスワードを追加するには、[非公開 - パスワードが必要]を選択します。
    • 「CMS Hub Enterprise」アカウントをご利用の場合は、[非公開 - 登録が必要]を選択して、このコンテンツの閲覧に際し、訪問者にサイトへの登録を求めることもできます。 
    • CMS Hub EnterpriseまたはMarketing Hub Enterpriseアカウントでは、[非公開 - シングルサインオン(SSO)が必要]を選択して、訪問者にGoogleやOktaなどのIDプロバイダーでのサインインを求めることができます。 

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

  • コンテンツを開きます。

    • ウェブサイトページ:HubSpotアカウントにて、[マーケティング]>[ウェブサイト]>[ウェブサイトページ]の順に進みます。
    • ランディングページ:HubSpotアカウントにて、[マーケティング]>[ランディングページ]の順に進みます。
  • ページの上にカーソルを重ねて[編集]をクリックします。 
  • [設定]メニューをクリックし、[詳細]を選択します。
  • このページを動的なページにするには、ダイアログボックスで[データソース]ドロップダウンメニューをクリックし、HubDBテーブルまたはプロパティーを選択します。詳しくは、動的ページの使い方をご確認ください。 
  • ページのHeadまたはフッターのHTMLにコードスニペットを追加するには、[ヘッダーHTML]フィールドまたは[フッターHTML]フィールドをクリックして、コードスニペットを入力します。または、特定のドメインの全てのページにコードスニペットを追加するには、ウェブサイトの設定にアクセスします。
  • カスタムのcanonical URLを追加するには、[canonical URLをカスタマイズ]フィールドにURLを入力します。、canonical URLの使用について詳しくはこちら
  • ページに関連付けられる、されたさまざまなタイプのスタイルシートを管理します。 
    • ドメインスタイルシート:これらのスタイルシートは、ウェブサイト設定で指定されている1つのドメイン上の全てのページに関連付けられます。特定のページについてドメインスタイルシートをオフにするには、ドロップダウンメニューをクリックし、[無効]を選択します。ドメインスタイルシートとの連携について詳しくはこちら .
    • テンプレートスタイルシート:これらのスタイルシートは、ページのテンプレートで設定されます。特定のページについてテンプレートスタイルシートをオフにするには、ドロップダウンメニューをクリックし、[無効]を選択します。このセクションはテーマテンプレートを使用しているページには表示されません。 
    • ページスタイルシート:これらのスタイルシートは、当該ページだけに適用されます。ページスタイルシートを添付するには、[スタイルシートを添付]ドロップダウンメニューをクリックし、関連付けるスタイルシートを選択します。ドメインスタイルシートやテンプレートスタイルシートも使用されている場合は、そのスタイルが優先されます。 

ページを公開する

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

  • コンテンツを開きます。

    • ウェブサイトページ:HubSpotアカウントにて、[マーケティング]>[ウェブサイト]>[ウェブサイトページ]の順に進みます。
    • ランディングページ:HubSpotアカウントにて、[マーケティング]>[ランディングページ]の順に進みます。
  • ページの上にカーソルを重ねて[編集]をクリックします。 
  • ページをすぐに公開するには、右上の[公開]をクリックします。
  • 後でページを公開するようにスケジュールするには: 
    • 右上の[公開]ボタンの隣にあるドロップダウンメニューをクリックし、[公開オプション]を選択します。
    • ダイアログボックスで、[公開を予定としてスケジュール]チェックボックスをオンにします。 
    • [日付]フィールドをクリックし、ページを公開する日付を選択します。 
    • [時刻]フィールドをクリックし、ページを公開する時刻を選択します。 
    • [スケジュール]をクリックします。または、[スケジュールして編集を続ける]をクリックすると、ページの公開をスケジュールした上で、コンテンツエディターに戻ることができます。 

schedule-pages-for-publishing

  • 特定の時期が来たら自動的にページを非公開にするには:
    • 右上の[公開]ボタンの隣にあるドロップダウンメニューをクリックし、[公開オプション]を選択します。
    • ダイアログボックスで、[公開終了スケジュールを設定]タブをクリックします。 
    • [公開終了スケジュールを設定]チェックボックスをオンにします。 
    • [日付]フィールドをクリックし、ページの公開を終了する日付を選択します。 
    • [時刻]ドロップダウンメニューをクリックし、ページの公開を終了する時刻を選択します。 
    • [ページの公開が終了になると、訪問者を次の場所へリダイレクト(転送):]ドロップダウンメニューをクリックし、リダイレクト先のページを選択します。外部宛先URLを使用するには、ドロップダウンメニューをクリックし、[外部URLを入力]を選択します。ダイアログボックスにURLを入力し、[保存]をクリックします。 
    • [今すぐ更新]をクリックします。

schedule-pages-for-unpublishing

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

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

  • コンテンツを開きます。

    • ウェブサイトページ:HubSpotアカウントにて、[マーケティング]>[ウェブサイト]>[ウェブサイトページ]の順に進みます。
    • ランディングページ:HubSpotアカウントにて、[マーケティング]>[ランディングページ]の順に進みます。
  • ページの上で、[編集]をクリックします。 
  • コンテンツエディターで、左のサイドバーにあるgauge [最適化]アイコンをクリックします。 
  • コンテンツをトピックと関連付けるには: 
    • 既存のトピックを追加するには、[トピック]ドロップダウンメニューをクリックし、ページのトピックを選択します。
    • 新しいトピックを作成するには、[トピック]ドロップダウンメニューをクリックし、[コアトピックを追加]を選択します。ダイアログボックスにトピックを入力し、[保存]をクリックします。
  • ページをサブトピックキーワードに関連付けるには:
    • [これはサポートコンテンツですか?]チェックボックスを選択します。
    • [サブトピックキーワード]ドロップダウンメニューをクリックし、サブトピックキーワードを選択します。
    • 新しいキーワードを作成するには、[サブトピックキーワード]ドロップダウンメニューをクリックし、[サブトピックキーワードを追加]をクリックします。ダイアログボックスにサブトピックキーワードを入力し、[保存]をクリックします。 

optimize-seo-on-a-page

  • 不完全なSEOの推奨を表示するには、赤丸のついたカテゴリーをクリックします。完了した各推奨事項には緑のチェックマークが付きます。未完了の各推奨にはグレーのチェックマークが付きます。SEO推奨を利用する方法について詳細をご確認ください。 
optimize-tab-displaying-seo-recommendations

ページのプレビュー

ページを公開する前に、さまざまなデバイスタイプでプレビューし、スマートコンテンツやパーソナライゼーションをテストできます。プレビューリンクは、あなたのアカウントの他のユーザーと内部で共有するように設計されています。 

  • コンテンツを開きます。

    • ウェブサイトページ:HubSpotアカウントにて、[マーケティング]>[ウェブサイト]>[ウェブサイトページ]の順に進みます。
    • ランディングページ:HubSpotアカウントにて、[マーケティング]>[ランディングページ]の順に進みます。
  • ページの上で、[編集]をクリックします。 
  • コンテンツエディターで、右上の[プレビュー]をクリックします。 
  • ページ全体をプレビューするには、右上の[新しいウィンドウで開く]をクリックします。このプレビューページをアカウント内のユーザーと共有するには、プレビューページでリンクコピーをクリックします。ページがHubSpotシステムドメインでホストされている場合、このプレビューを表示するにはHubSpotにログインする必要があります。
  • 別のデバイスでの表示をプレビューするには、プレビューページの右上にあるmobileデバイスアイコンをクリックします。 

preview-content

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

preview-as-contact 

この記事はお役に立ちましたか?
こちらのフォームではドキュメントに関するご意見をご提供ください。HubSpotがご提供しているヘルプはこちらでご確認ください。