Eメールやページ内の画像、CTA（旧）、ロゴを中央に配置する。

デザインマネージャーツールで作成したレイアウトテンプレートを使用している場合は、テンプレートにインラインスタイルを追加して、画像、CTA（旧）、またはロゴモジュールをページ、ブログ、またはEメールの中央に配置します。

ドラッグ＆ドロップエリアを含むテンプレートを使用している場合、コンテンツエディター内でモジュールの配置を中央に配置することができます。また、ページエディターでは、水平スペーサーを使用してモジュールを中央に配置することができます。 

注: 2025年3月17日以降に作成されたアカウントは、CTA(旧)ツールにアクセスできません。

インラインスタイル設定で画像、CTA（旧）、ロゴを中央に配置する 

インラインスタイルを使用して画像を中央に配置するには、HTMLの基本的な知識が必要です。ページやテンプレートにスタイルシートが添付されていたり、スタイルが追加されている場合、画像、CTA（旧）、ロゴに影響を与える既存のCSSが存在する可能性があります。HubSpotでは、デザイナーと協力してスタイル設定の原因を特定し、アセットを中央に配置するために必要な変更を行うことを推奨しています。 

Eメールやページのテンプレートで、画像やCTA（旧）、ロゴを中央に配置する場合：

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

  • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
  • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
  • ブログ：HubSpotアカウントにて、［コンテンツ］＞［ブログ］の順に進みます。
  • Eメール：HubSpotアカウントにて、［マーケティング］＞［Eメール］の順に進みます。

• コンテンツにマウスポインターを合わせ、「編集」をクリックします。
• エディターで、私のコンテンツの設定にアクセスします： 
  • 投稿とページについては、設定メニューをクリックし、詳細を選択する。
  • Eメールの場合は、設定タブをクリックし、詳細オプションセクションをクリックして展開します。 

• テンプレートセクションで、このテンプレートを編集をクリックし、デザインマネージャーでテンプレートを開きます。 

• デザインマネージャーで、ロゴ、 CTAコール トゥ アクション、画像モジュールをクリックします。 
• 右列のインラインスタイルフィールドにtext-align: center;と入力する。

 

• 右上の「変更を公開する」をクリックすると、このテンプレートに変更が適用されます。

モジュールのスタイル設定オプションから、画像、CTA（旧）、ロゴを中央に配置する。

ドラッグアンドドロップエリアがあるテンプレートを使用している場合、特定のモジュールやセクションで、位置合わせを直接設定することを選択することができます。ただし、このスタイル設定オプションは、全てのテンプレートやモジュールで利用できるわけではないことに注意してください。 

• ページまたは投稿モジュールを中央に配置する：

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

    • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
    • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
    • ブログ：HubSpotアカウントにて、［コンテンツ］＞［ブログ］の順に進みます。
    ページまたはブログ記事にマウスポインターを合わせ、編集をクリックします。
  • ページエディターで、中央そろえにしたいモジュールをクリックします。 
  • 左のパネルで、スタイルタブをクリックし、位置合わせとスペースセクションをクリックして展開します。 
  • 位置合わせ］で［中央揃え］を選択します。
    
    

• Eメールモジュールのセンタリングに。 
  • HubSpotのアカウントで、［マーケティング］>［Eメール］に移動します。
  • Eメールにマウスポインターを合わせ、「編集」をクリックします。
  • 中央そろえにしたいモジュールをクリックします。 
  • 左のパネルで、「整列」ドロップダウンメニューをクリックし、「中央」を選択します。
    
    

画像、CTA（旧）、ロゴを水平スペーサーで中央に配置する。

使用しているモジュールに整列オプションがない場合、コンテンツエディターから、水平スペーサーをページに追加して、代わりにモジュールを中央に配置することができます。 

水平スペーサーを使用してモジュールを中央そろえにする場合。 

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

  • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
  • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
  • ブログ：HubSpotアカウントにて、［コンテンツ］＞［ブログ］の順に進みます。
• コンテンツエディターの左列で、+ Addをクリックする。 
• 検索バーで、「水平スペーサー」と検索してください。 
• 水平スペーサーをクリックして、中央そろえにしたいモジュールの両脇にドラッグします。次に、スペーサーの幅を調整して、エレメントを中央に配置する。