リッチテキストモジュールでのアイコンの挿入と編集

アイコンはリッチ テキスト コンテンツ内の重要な情報や行動に注意を引きつけるのに役立ちます。Font Awesome ライブラリーにアイコンを挿入すれば、ブログ記事やページで モジュールのリッチテキスト を作成できます。アイコンが追加されると、色、ポジショニング、サイズをカスタマイズすることができます。

注意事項：マーケティングEメールに直接アイコンを追加することはできません。Eメールでアイコンを使用するには、アイコンを画像として保存し、 その画像をEメールエディターに挿入します。

アイコンを挿入する

1. 目的のコンテンツに移動します。
   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
   • ブログ：HubSpotアカウントにて、［コンテンツ］＞［ブログ］の順に進みます。
2. コンテンツの名前をクリックします。
3. アイコンを表示したい場所で、［リッチテキストモジュール］をクリックします。
4. リッチ テキスト ツールバーの右上にある [挿入]ドロップダウンメニューをクリックし、[アイコン]を選択します。

5. ポップアップ ボックスで、検索バーからアイコンを検索する。
6. アイコンをクリックして、リッチテキストモジュールに挿入します。
7. 完了したら、右上の [公開 ]または [更新 ]をクリックします。

アイコンの編集

アイコンのスタイル、位置合わせ、他のコンテンツへのリンクを編集します。また、アイコンを置き換えたり、削除したりすることもできます。

1. 目的のコンテンツに移動します。
   1. ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   2. ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
   3. ブログ：HubSpotアカウントにて、［コンテンツ］＞［ブログ］の順に進みます。
2. コンテンツの名前をクリックします。
3. コンテンツエディターで、［アイコン］をクリックしてアイコンエディターを開きます。
   • アイコンの色を編集するには、backgroundColor アイコンの色ドロップダウンメニューをクリックし、色を選択します。16進値または RGBカラー値を入力するには、[ 詳細]タブをクリックします。
   • indent インデントアイコン を使用して、アイコンを右または左に移動します。
   • blockAlignmentBottom 位置合わせ アイコンを使用して、テキストブロック内のアイコンの位置を調整します。
   • アイコンにリンクを追加するには、[ link link]アイコンをクリックし、 リンクを挿入します。
   • アイコンのサイズを変更するには、エディターでアイコンのコーナーをクリックしてドラッグするか、ツールバーで幅と高さにピクセル値を入力します。
4. リッチ テキスト モジュールからアイコンを削除するには、 アイコンをクリックします。次に、 delete 削除アイコンをクリックします.
5. アイコンを置き換えるには、 アイコンをクリックします。次に、 replace 置換アイコンをクリックし、新しい アイコンを選択します。
6. 完了したら、右上の [公開 ]または [更新 ]をクリックします。

詳細アイコンオプションを編集する

アイコンの詳細オプションを編集してアクセシビリティーテキストを追加するか、アイコンリンクをカスタマイズします。 

1. 目的のコンテンツに移動します。
   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
   • ブログ：HubSpotアカウントにて、［コンテンツ］＞［ブログ］の順に進みます。
2. コンテンツの名前をクリックします。
3. コンテンツエディターで、 アイコンをクリックします。
4. edit 編集アイコンをクリックします。
5. ポップアップボックスで、Advancedをクリックする。
6. アイコンにリンクがある場合、1つ以上の リンクタイプを選択できます。これにより、このリンクとウェブサイトとの関係が検索エンジンに伝わります。さまざまなリンクタイプについて詳しくはこちら .
7. 画像に目的を選択する。
   • アイコンが情報を伝えるためのものである場合は、「スクリーンリーダーによって読まれる」を選択し、その目的を説明するtitleを追加してください。
   • アイコンで情報が伝わらない場合は、[ スクリーンリーダーによって無視]を選択します。

8. ［適用］をクリックします。
9. 完了したら、右上の [公開 ]または [更新 ]をクリックします。