お客さまへの大切なお知らせ:膨大なサポート情報を少しでも早くお客さまにお届けするため、本コンテンツの日本語版は人間の翻訳者を介さない自動翻訳で提供されております。正確な最新情報については本コンテンツの英語版をご覧ください。
CTAにカスタムスタイルを追加する
更新日時 2023年 1月 18日
HubSpotのCTA(Call-To-Action)詳細オプションを使用すると、ウェブサイトのテーマに合わせて、簡単にCTAボタンを細かくカスタマイズ設定することができます。
注:カスタムスタイルはカスタムボタンのみに適用され、画像ボタンには適用されません。
- HubSpotアカウントにて、[マーケティング] > [リードの獲得] > [CTA]の順に進みます。
- CTAの上にカーソルを重ねて[アクション]>[編集]の順にクリックするか、[CTAを作成]をクリックします。
-
スライドインパネルの下までスクロールし、[詳細オプション]をクリックします。
- カスタムCSSスタイルをCTAに適用するには、次の2つの方法があります。
- CTAにカスタムクラスを追加する場合、[カスタムCSSクラス]フィールドにカスタムクラスを入力できます。これが役に立つのは、複数のウェブサイトページにまたがって使用されているCTAで、フォントファミリー、サイズ、パディング、マージンといった類似のデザイン特性のセットを共有する必要がある場合です。カスタムCSSクラスを使用する場合、HubSpotのページでメインスタイルとして適用されるCSSスタイルシートにそのクラスを含めてスタイルを設定する必要があります。
- 編集中のCTAにカスタムスタイルを適用する場合は、[カスタムCSS]フィールドで、CTAに固有のインラインスタイルを適用することができます。変更したいCTAの要素がある場合は、変更を保存する前にここに新しいスタイルの宣言を追加します。
注:カスタムCSSスタイルをCTAに適用する場合は、[カスタムCSSクラス]オプションまたは[カスタムCSS]オプションのいずれか一方だけを使用する必要があります。両方のオプションが適用されると、CTAのスタイルや表示に問題が発生する可能性があります。

- 右下の[次へ]をクリックして、CTAの作成または編集を終了します。
CTAs
貴重なご意見をありがとうございました。
こちらのフォームではドキュメントに関するご意見をご提供ください。HubSpotがご提供しているヘルプはこちらでご確認ください。
関連記事
-
HubSpotコンテンツに動画を追加する
HubSpot動画を使用すると、ファイルツールに動画をアップロードし、ページ、マーケティングEメール、ブログ記事、ナレッジベース記事に動画を追加できます。 HubSpot動画は、ドラッグ&ドロップ マーケティングEメール
ナレッジベース -
スマートコンテンツ | よくある質問
スマートコンテンツに関する一般的な質問への回答を見つけてください。マーケティングEメール、ブログ記事、ランディングページ、ウェブサイトページ、テンプレートにスマートコンテンツを追加することができます。 ...
ナレッジベース -
HubSpotのコンテンツとデータをエクスポートする
ページ、コンタクト、ファイルなど、自分のアカウントからHubSpotコンテンツとデータをエクスポートする方法を説明します。 ...
ナレッジベース