アメブロに無料お問い合わせフォームを設置する方法

アメブロに設置するお勧めの無料お問い合わせフォームを比較という記事で、お勧めのお問い合わせフォームをお伝えしたので、この記事では作成したお問い合わせフォームを実際にアメブロに設置する方法をお伝えしていきます。

 

お問い合わせフォーム設置には2種類ある

お問い合わせフォームの設置には、「ページ内に埋め込む方法」と「リンクをクリックしてフォームを表示する方法」があります。

ページに埋め込む方法は、アメブロの場合、少し難易度が高いためお勧めしていません。

そのため、この記事では「リンクをクリックしてフォームを表示する方法」をご紹介します。

 

記事にお問い合わせフォームを設置する方法

「ブログを書く」から新規記事を作成します。
(すでにある記事にお問い合わせフォームを設置したい場合は、記事の編集をします)

下記のようなカタチで、お問い合わせフォームをリンクするための文字を記入します。

 

リンクしたい文字をマウスで選択して、「リンク」をクリックします。

 

「リンクの作成」画面が表示されるので、作成したお問い合わせフォームのURLをコピーして貼り付けます。

このとき、「リンクを新しいウィンドウで開く」にチェックを入れて、「決定」をクリックします。

「リンクを新しいウィンドウで開く」について

チェックをいれると、リンクをクリックしたときに、リンク先が今見ているタブや画面とは別の新しいタブや画面で開くようになります。

外部リンクに移動する際は、同じウィンドウで開くと、読者さんが迷子になったり、ブログから離脱してしまったりしやすいので、新しいウィンドウで開くようにしておくことをお勧めします。

 

ここまでの作業で記事を見てみると、下記のようになっています。

こちらでも特に問題はないのですが、一般的に「リンク」は青文字のほうが、パッと見てリンクだと認識されやすいので、文字を青文字に、リンクが目立つように太字に変更しておきます。

変更したい文字を選択し、太字にするには、「B」をクリックします。
文字のリンクを変更するため、「A」をクリックします。

 

文字の色は、赤枠のなかの青系にしておきましょう。

 

あとは、記事を「公開」すればOKです。

これで記事にお問い合わせフォームを設置することができました。

 

メッセージボードにお問い合わせフォームを設置する方法

メッセージボードとは、ブログのトップページに表示されるこちらの部分のことです。

 

メッセージボードにお問い合わせフォームを設置する準備段階として、先ほど作成したお問い合わせフォームの記事を編集画面で開きます。

「HTML表示」をクリックして、HTMLを表示させ、赤枠で囲った部分をコピーします。
(パソコンの「メモ帳」などに貼り付けておくと便利です)

 

次に、マイページの「設定」から「メッセージボード」をクリックします。

 

先ほどコピーしたHTMLコードを貼り付けて、「公開」をクリックします。

 

このようなカタチで表示されます。

 

サイドバーにお問い合わせフォームを設置する方法

サイドバーとは、ブログの記事エリアの隣に表示されるエリアです。

 

こちらに直接お問い合わせフォームを埋め込むカタチで表示されている方が、なかにはいらっしゃるのですが、あまりお勧めしません。

本来、お問い合わせフォームというものは、読者さんが記事の内容を読んだり、プロフィールを見たりして、はじめてお問い合わせにつながります。

ですから、ブログのトップページや記事ページのわかりやすい位置にお問い合わせ方法を載せておけばよいのです。

サイドバーにお問い合わせフォームを設置する場合は、「フリースペース」を使用します。

メッセージボードの設定と同様に、記事編集からHTMLをコピーしておきます。

 

次に、ブログ管理の右上アイコンから「フリースペース編集」をクリックします。

フリースペースは、プロフィールページ(緑枠)にもありますので間違えないように注意してください。

 

記事からコピーしたHTMLを貼り付けて、「保存」をクリックします。

 

ここまででブログをみてみると、下記のようにサイドバーの下の方に表示されています。

 

表示されている場所を変更するには、「配置設定」をクリックします。

 

フリースペースをドラッグ&ドロップで(マウスでつかんで)、入れたい位置に持って行きます。

私の場合は、フリースペースをプロフィールの上あたりに持って行くことが多いです。

 

このようにサイドバーの上に表示されました。

注)広告を外していない場合、サイドバーの2番目の部分に広告が表示されます。

フリースペースを1番目に持ってきた場合は、
フリースペース(1番目の項目)→広告→プロフィール(2番目の項目)
となります。

 

以上が、アメブロにお問い合わせフォームを設置する方法です。

参考にしてみてくださいね。

 COMMENT

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

アメブロに設置するお勧めの無料お問い合わせフォームを比較

アメブロのブログデザインはカスタマイズした方がいいのか?悩んでいる女性起業家さん...

お勧め無料お問い合わせフォーム『フォームメーラー』の登録方法と使い方

アメブロのブログタイトルとニックネームを決めるための3つの大事なポイント

お勧め無料お問い合わせフォーム『フォームズ』の登録方法と使い方

女性起業家に人気の無料ブログ アメーバブログを開設しよう