更新日時 2023年 1月 19日
組み込みサイズ設定オプションとカスタム CSS を使用して CTA のサイズを調整する。
- HubSpotアカウントにて、［マーケティング］ > ［リードの獲得］ > ［CTA］の順に進みます。
- CTAの上にカーソルを置いて、[アクション]ドロップダウンメニューをクリックし、[編集]を選択します。
- スライドインパネルで[高度なオプション]をクリックします。
- [自動的にサイズ]チェックボックスをクリアして,[横方向のパディング]及び[縦方向のパディング]フィールドにサイズ値を入力します。。
- [次へ]>をクリックします。
- [保存]をクリックし,[完了]をクリックします。
カスタムボタンCTAを設計した後、CTAにコンテナあるいはモジュールの全体幅を記入するために：
- [自動的にサイズ]チェックボックスをクリアします。
- カスタムCSS フィールドで、カスタムCSSを入力します。
- 幅を幅に設定します。：100%;
- [次へ]>をクリックします。
- [保存]をクリックし,[完了]をクリックします。
非 HubSpot サイトにイメージ CTA を埋め込んだ場合, イメージ CTA をレスポンシブにするスタイルシート内で、追加の CSS 宣言(幅：100%;)を適用する必要があるかもしれません。
retina 最適化とは何ですか？
Retina 最適化を使用すると, サイトページで CTA の画像がより明確に表示され, Eメールで受信者が Apple mail と iOS mail の現在のバージョンで CTA を閲覧する場合；Outlook またはGメールのようなウェブメールのサービスはサポートされていません。
retina 最適化は, CTA に必要なサイズを少なくとも 2 回アップロードすると, インターネット全体のインターネット全体のすべての画像でどのようにサポートされるかと同様に, 少なくとも 2 回アップロードされる場合にサポートされます。。100 px X 400 px で CTA を作成する場合, @2 x ピクセル密度表示をサポートするために, アップロードされた画像は 800 px です。CTA のサポートは, この場合, 1600 px X 400px の画像をアップロードして４ｘバージョンまでサポートします。CTA は, 1x, 2x, 3x, 及び4x 倍のバージョンの srcset 属性を使用してウェブサイトに自動的に表示されます。
画像が CTA のサイズにアップロードされた場合,(例、400 px イメージの 400px X 100px CTA 画像が 400px X 100px CTA によってアップロード), これにより, retinaサポートはありません。
