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

外部サイトにCTA(Call-to action)を埋め込む

更新日時 2023年 1月 19日

対象製品

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

HubSpotのCTAは、HubSpotのページでもHubSpot以外のページでも使用することができます。外部サイトでHubSpotのCTAを使用して、リードを引き寄せ、コンバージョンにつなげましょう。

外部サイトにCTAを埋め込む前に、HubSpotのトラッキングコードがページにインストールされていることを確認してください。

  • HubSpotアカウントにて、[マーケティング] > [リードの獲得] > [CTA]の順に進みます。
  • Calls-to-actionダッシュボードで、CTAの上にカーソルを置き、Actionsをクリックします。 > コードを埋め込む

  • ダイアログボックスで、[コピー]をクリックします。

  • 外部ウェブサイトのコンテンツ管理システム(CMS)に移動します。 
  • HubSpot以外のページのHTML内で、 CTAを表示したい場所にCTA埋め込みコードを貼り付けます。
  • CTAをウェブページ上でプレビューし、本番でどのように見えるかを確認します。CTAが正しく表示されない場合は、コピーしたコードが外部のCMSで変更されていないことを確認します。画像CTAを使用している場合, レスポンシブな画像CTAにするには、スタイルを追加する必要があります。
  • 完成したら、ページを公開します。

注: 

  • 外部ウェブサイトに埋め込まれたCTAは、CTAのコンテンツ、テキスト、または全般的なデザインに変更が加えられると、グローバルに自動更新されます。
  • コンテンツ管理システム(CMS)の違いにより、サイトのHTMLコードにアクセスしてCTAコードを埋め込む手順が異なる場合があります。サイトのHTMLコードへのアクセス方法や、外部コードの埋め込み方法が不明な点がある場合は、この記事を担当のウェブマスター、IT部門、または技術リソースにEメールでお送りください。
  • WordPressのサイトに CTAを埋め込む場合、以下の点にご注意ください。

    • WordPressサイトにCTAを埋め込む場合、CTAをレスポンシブにするために、外部スタイルシート内で追加のCSS宣言を適用する必要がある場合があります。
    • CTAがWordPressで機能していなかったり、ライブページを表示すると埋め込みコードが変更されることに気付いた場合は、埋め込みコードが変更されないように、プラグインを使用してCTAを挿入する必要があります。
    • 最新バージョンのGutenbergを使用している場合、インラインJavaScriptが削除されるため、Gutenberg用のインラインJSブロックプラグインを使用して、フォームとCTAをページに埋め込んでください。
この記事はお役に立ちましたか?
こちらのフォームではドキュメントに関するご意見をご提供ください。HubSpotがご提供しているヘルプはこちらでご確認ください。