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

CTAの作成(旧)

更新日時 2024年 3月 13日

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

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

旧CTAとは、HubSpotのコンテンツで使用できるボタンで、見込み客をウェブサイトに誘導し、フォームでコンバージョンできます。CTAを作成した後、CTAの表示数やクリック数を確認することができます。CTA(旧)のパフォーマンス分析について詳細をご確認ください。 

ボタン、バナー、ポップアップなど、より多くのCTAタイプを作成するには、新しいCTAエディターの使い方をご覧ください。

注:既存のCTA(旧)は新しいエディターに移行することをお勧めします。CTA(旧)の移行について詳細をご確認ください。

CTA(旧)を作る

CTA(旧)を作成する場合、カスタムボタンをデザインしたり、画像をCTAとして使用することができます。CTA(旧)作りを始めるために:
  • HubSpotアカウントにて、[マーケティング]>[リード情報の収集]>[CTA]の順に進みます。
  • 左上のドロップダウンメニューをクリックし、[CTA(旧)]を選択します。
  • 右上の[CTAを作成]をクリックします。 

カスタムボタンのデザイン 

CTAエディターのデザインオプションを使って、CTA(旧)をカスタムボタンとして設定することができます。CTAをカスタムボタンとしてデザインするには、次の手順に従います。 

  • 右側のパネルで[カスタムボタン]を選択します。
  • 以下のオプションを利用してボタンにスタイルを設定します。
    • ボタンコンテンツ:CTAボタンに表示されるテキストを入力します。絵文字を追加することもできます。コンタクトと訪問者には、使用しているデバイスのネイティブ絵文字スタイル(Mac、Windows、Chrome、Androidなど)が表示されます。
    • ボタンスタイル:ドロップダウンメニューを使用して、CTAボタンのスタイルを選択します。ボタンを通常のテキストリンクのように表示する場合は、ドロップダウンメニューから[リンク(スタイルなし)]を選択します。
    • ボタンの色:カラーパレットをクリックするか、カスタムカラーの16進数値を[ボタンの色]フィールドに入力します。
    • 詳細オプション:[詳細オプション]をクリックしてCTAのピクセルパディングCSSスタイルをカスタマイズします。
  • 右側のパネルの下部にある[次 >]をクリックします。




イメージボタンのデザイン 

カスタムボタンをデザインする代わりに、画像をアップロードしてCTAのデザインとして使用することもできます。CTAを画像ボタンとしてデザインするには、次の手順に従います。 

  • 右側のパネルで[画像ボタン]を選択します。
  • 画像をアップロードし、CTAのスタイルを設定します。
    • アップロード:デバイスから画像ファイルを選択します。 
    • 画像を参照:ファイルマネージャーから画像を選択します。[画像を挿入]パネルで、CTAボタンとして使用する画像を選択します。 
    • 幅:画像ボタンのを調整します。アップロードされた画像のretina最適化についてご確認ください。
    • 高さ:画像ボタンの高さを調整します。
    • altテキスト:画像の代替(Alt)テキストを入力します。
  • 右側のパネルの下部にある[次 >]をクリックします。



CTA(旧)の選択肢を設定する 

CTA(旧)を設計したら、CTAのオプション設定をして、CTAの名前、CTAのリダイレクト先、関連付けされるキャンペーンを決定します。 

CTAオプションを設定するには、次の手順に従います。 

  •  [オプション]ページで、以下を設定します。
    • CTA内部名:CTAの名前を入力します。CTA内部名は、ご使用のHubSpotアカウントのユーザーのみに表示されます。 
    • URLリダイレクトタイプ:CTAのリダイレクト先のオプションを選択します。 
      • 外部ウェブサイトURL:CTAをHubSpot外部のページにリンクします。[URLを入力]フィールドに、訪問者を誘導するウェブサイトURLを入力します。
      • HubSpotページまたはブログ記事:CTAをいずれかのHubSpotページまたはブログ記事にリンクします。[HubSpotページまたはブログ記事]ドロップダウンメニューをクリックし、ページまたは記事を選択します。ボタンCTAのリンクはページIDに紐付けられ、ページのURLが変更されるとボタンCTAのリンクも自動的に更新されます。 
      • ミーティングリンク:CTAをHubSpotミーティングリンクにリンクします。[ミーティングリンクを選択]ドロップダウンをクリックし、ミーティングリンクを選択します。このリンクを新しいページで開くには、[新しいウィンドウでページを開く]チェックボックスをオンにします。 
      • ファイルリンク:ファイルマネージャーでCTAをファイルにリンクさせます。ボタン CTAをクリックしたブラウザーに画像を表示する場合は、「ファイルを参照」をクリックしてファイルを選択し、「新しいウィンドウでページを開く」チェックボックスを選択します。 
      • Eメールアドレス:mailtoリンクを作成します。
      • 電話番号:指定された電話番号にコールするリンクを作成します。
    • キャンペーン: CTA(旧)分析をキャンペーンに関連付けたい場合は、ドロップダウンメニューをクリックし、キャンペーンを選択します。 
  • [保存]をクリックします。CTAがパネルの上部に表示されます。

注:

  • CTA(旧)ツールはパーソナライズトークンをサポートしていません。ボタンCTAにパーソナライズトークンを追加するとエラーになります。ブログ記事、ページ、マーケティングEメールでは、代わりにボタンモジュールを使ったパーソナライズトークンの使用を検討することができます。
  • コンテンツステージングでページを設定した場合、CTA(旧)は自動的に更新されず、元のページにリンクされたままとなります。既存のCTAを更新するか、新しいページに新しいボタンCTAを作成することをお勧めします。

 

 

CTA(旧)の作成を完了させる

CTAのデザインとオプションを設定した後、次の操作を実行できます。
  • CTA内部名を編集するには、上部にあるedit 鉛筆アイコンをクリックして、CTA内部名を編集します。
  • CTAの作成を終了するには、[閉じる]をクリックします。 
  • スマートボタンCTAを作成するには、[スマートバージョンを作成]をクリックします。 
  • ボタンCTAをA/Bテストするには、[多変量テストを作成]をクリックします。



CTA(旧)アクションの追加

CTA(旧)ダッシュボードでは、ハイレベルな指標を分析してCTAのパフォーマンスを確認したり、表示されたCTAに対してアクションを起こすことができます。

  • CTAをプレビューするには、CTAの上にマウスポインターを置き、プレビューをクリックすると、プレビューサイドバーペインにCTAが表示されます。
  • CTAに対してアクションを実行するには、[アクション]ドロップダウンメニューをクリックして、次のいずれかを選択します。 
    • 編集: CTA(旧)エディターでCTAを変更する。 
    • 多変量テストを作成:CTAの2番目のバージョンを作成し、コンタクトと訪問者を使用してA/Bテストを実行します。 
    • スマートバージョンを作成:具体的な表示ルールに応じて異なるバージョンのCTAを表示するスマートボタンCTAを作成します。 
    • 詳細を見る:閲覧数、クリック数、送信数など、CTAのアナリティクスを確認します。
    • 複製:CTAの完全なコピーを作成します. 
    • 埋め込みコード:埋め込みコードをコピーして貼り付けることで、CTAを外部ページに追加します。
    • 削除:CTAを恒久的に削除します。

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