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

レイアウトエディターでページ、Eメール、ブログのテンプレートを作成する

更新日時 2023年 6月 28日

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

Marketing Hub Professional, Enterprise
CMS Hub Professional, Enterprise
Marketing Hub Basic(旧製品)

テンプレートを使用すると、ブログ、ページ、またはEメールでさまざまなタイプのコンテンツの構造を制御できます。デザインマネージャーでは、モジュールをドラッグ&ドロップすることでテンプレートを作成することができます。HubSpotのテンプレート構成に関するさらに詳しい説明は、こちらのアカデミー講座(英語)を参照してください。

注:Eメールテンプレートを作成するには、Marketing Hub ProfessionalまたはEnterpriseのサブスクリプションが必要です。CMS Hubアカウントの場合は、ドラッグ&ドロップで操作できるEメールエディターを使用してEメールを作成できます

HubSpotテンプレートについて

HubSpotのテンプレートは、ユーザーがコンテンツエディターで作成するブログページ、E メールの構造を設定するもので、コンテンツモジュールをドラッグ&ドロップしてレイアウトを作成することで、テンプレートを構築することができます。HTMLを使用してテンプレートを作成する場合は、カスタムコード化されたテンプレートの作成について詳しく説明します。 

レイアウトエディターを使えば、アイデア、スケッチ、プロトタイプをコンテンツ作成のためのレスポンシブテンプレートに変換することができます。

モックアップからレイアウトへ

新規テンプレートを作成する

  • HubSpotアカウントにて、[マーケティング]>[ファイルとテンプレート]>[デザインツール]の順に進みます。
  • ファインダー上部で[ファイル]>[新規ファイル]をクリックします。

新規テンプレート作成

  • ダイアログボックスで、[今日は何を作成しますか?]ドロップダウンメニューをクリックし、[ドラッグ&ドロップ]を選択します。[次へ]をクリックします。
  • [テンプレートタイプ]ドロップダウンメニューをクリックしてタイプを選択します。ほとんどのデフォルトモジュールはどのテンプレートでも利用可能ですが、一部のモジュールは特定のテンプレートタイプに限定されています。テンプレートのタイプは、次の中から選択します。
    • ブログ:個別のブログ記事およびブログリストページのテンプレート。
    • Eメール:Eメールのテンプレート。
    • ページ:ウェブサイトとランディングページのテンプレート。
    • システム:エラー、パスワードプロンプト、 Eメール購読ページのテンプレート。 
  • ファイル名を入力します。完了したら、[作成] をクリックします。
new%20file
 

テンプレートの構成とカスタマイズ

デザインマネージャーの右側にあるインスペクターを使用して、テンプレートにモジュールを追加することができます。インスペクターの[+追加]をクリックして、追加したいモジュールを検索し、ドラッグ&ドロップのテンプレートレイアウトに追加します。テンプレートの構造の編集について、詳しくはこちらをご覧ください。

テンプレートのスタイルは、インスペクターのオプションを利用してカスタマイズできます。特定のモジュールを選択しない場合、テンプレートのHeadに直接スタイルを追加することができます。モジュールまたはグループをクリックすると、そのコンポーネントに固有のスタイルオプションにアクセスできます。インスペクタを使ってテンプレートをスタイリングする方法について、詳しくはこちらをご覧ください。

ご注意: CSSやJavascriptファイルをEメールテンプレートに添付することはできませんが、、カスタムHTMLマークアップ、ボディクラス、インラインスタイリングをテンプレートに追加することができます。 

HubSpotのヘルプ記事のスクリーンショット

テンプレートをプレビューして公開する

  • 右上の [プレビュー] をクリックして、ウェブブラウザーにテンプレートのプレビューを表示します。表示オプション付きライブプレビューを選択した場合他のデバイスで表示されるようにテンプレートを表示することができます。

  • テンプレートが完成したら、右上の [変更を公開] をクリックします。
    HubSpotのヘルプ記事のスクリーンショット

新しいテンプレートが公開されると、そのテンプレートを使って新しいページを作成したり、Eメールを作成したりすることができるようになります。ブログテンプレートは、ブログの設定で、既存のブログに適用することができます。

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