登録ページにロゴ画像を掲載するには？

2021年3月8日2023年2月10日

登録フォームに、登録してもらうサービスのアイコンやロゴ画像などのイメージを掲載してみましょう。
メインカラーやデザインの統一感で、利用者からより信頼を得やすい表現をすることができます。

オレンジフォームのヘッダ＆フッダ編集から、追加することができます。

登録フォームにアイコンやロゴ画像を掲載する方法

登録してもらうメルマガやサービスのアイコンなどに、使用したいイラストやロゴ画像をご用意ください。
既にご自身で作成済のものや著作権フリーの画像ファイルを使用します。
素材を加工する場合は、再配布など禁止されていることに注意しましょう。

画像ファイルは、公開していて外部からアクセスできる（ブラウザで見られる）ならば、その画像のアップロードされている場所のURLを取得してimgタグとともにヘッダ＆フッタ編集に記載すると、フォーム上に表示することができます。

ランディングページやホームページなどで既に作成しご自身で運用・公開しているものや、ダウンロードしウェブ表示用にサイズなどを加工済のフリー素材を、公開できるファイル共有サーバーにアップロードして準備しておきます。

オレンジスピリッツのロゴ画像を例にご説明します。

表示されるメニューから「画像アドレスをコピー」を選んで、画像のURLをクリップボードにコピーします。
テキストエディタなどに貼り付けてください。

※「リンクのアドレスをコピー」を選択してしまうと、クリックして開かれるリンク先の別ページのURLがコピーされます。
「画像アドレスをコピー」を選択して、画像がアップロードされている場所のURLを取得します。

フォーム設定＞[登録ページ（ヘッダ＆フッタ編集）]をクリックして開きます。

ロゴ画像やアイコンを、今回はヘッダーに追加します。

<img src="https://使用したい画像のURL/">

「<img」から始まるimg要素の中の「src="」以降に、クリップボードにコピーした画像アドレスを貼り付けます。
画像アドレスは、「"」（ダブルクォーテーション）で囲んでください。
今回はフォームの上部、一番上に設定します。

編集が完了したら、「更新」ボタンを押して保存します。

ロゴ画像が登録フォームの上部、ヘッダーの一番上に表示されます。

公開済の画像アドレスを取得し、登録フォームのヘッダーにHTMLタグを使って表示する方法をご説明しました。
サービスやメルマガを覚えてもらいやすくなりますね。

お問い合わせは、お問い合わせフォームよりお願いいたします。