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

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

更新日時 2020年 10月 19日

対象製品

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

ウェブサイトのコンテンツをHubSpotの外部でホストしている場合でも、HubSpot CTAを使用してリードの集客とコンバージョンを行うことができます。CTA埋め込みコードを使用して、外部サイトにCTAとスマートCTAを埋め込む方法を説明します。

  • HubSpotアカウントにて、[マーケティング] > [リードの獲得] > [CTA]の順に進みます。
  • [Calls-to-action]ダッシュボードで、CTAの上にカーソルを置いて[アクション]ドロップダウンメニューをクリックし、[埋め込みコード]を選択します。
  • ダイアログボックスで[コードをコピー]をクリックします。[閉じる]をクリックします。
  • 外部ウェブサイトのコンテンツ管理システム(CMS)に移動します。 
  • HubSpot以外のページのHTML内で、 CTAを表示したい場所にCTA埋め込みコードを貼り付けます。
  • ウェブページ上でCTAをプレビューし、実際にどのように表示されるかを確認します。CTAが正しく表示されない場合は、コピーしたコードが外部のCMSで変更されていないことを確認します。画像CTAを使用している場合, レスポンシブな画像CTAにするには、スタイルを追加する必要があります。
  • 完了したら、ページを公開して変更を適用します。

ウェブサイト/CMSごとに構造は異なるため、上記の手順にそのまま従っても、サイトのHTMLコードにアクセスできない場合があります。サイトのHTMLコードへのアクセス方法や、外部コードの埋め込み方法が不明な点がある場合は、この記事を担当のウェブマスター、IT部門、または技術リソースにEメールでお送りください。

ご注意ください:外部ウェブサイトに埋め込まれたCTAは、CTAのコンテンツ、テキスト、または全般的なデザインに変更が加えられると、グローバルに自動更新されます。

WordPressサイトにCTAを埋め込んでいる場合、CTAをレスポンシブにするには、外部スタイルシート内で追加のCSS宣言を適用する必要があります。

CTAがWordPressで機能していなかったり、ライブページを表示すると埋め込みコードが変更されることに気付いた場合は、埋め込みコードが変更されないように、プラグインを使用してCTAを挿入する必要があります。最新バージョンのGutenbergを使用している場合、インラインJavaScriptが削除されるため、Gutenberg用インラインJSブロックプラグインを使用して、フォームとCTAをページに埋め込んでください。