NoSKETCH BOOK

ぽんこつくんの気の向くのままに。

はてなブログ向けお問い合わせフォームの設置方法

 

f:id:nooosk39:20190726234526j:plain

 

先日の「プライバシーポリシーの設置方法」に続き、
はてなブログでのGoogleアドセンス合格を目指す同志に向けて、
今回は「お問い合わせフォームの設置方法」をご紹介したいと思います。

 

 

お問い合わせフォームとは?

 

そもそも、お問い合わせフォームとはなんでしょうか。

ずばり、ブログやウェブサイトに訪れてたユーザーが
運営者にコンタクトをとる際に使用される手段です。

 

お問い合わせフォームを設置することで、
運営者側は自分のメールアドレスをさらすことなく、
かつ、必要な情報を記入項目として指定することができるメリットがあります。

ユーザー側としても、自分のメールアドレスを不必要に知られることなく、
比較的気軽に、しかしフランクになりすぎず運営者にコンタクトをとることができます。

 

アドセンスにも、お問い合わせフォームがあると合格しやすいという噂もあります。
※あくまで噂です。笑

 

そして、今回ははてなブロガー向けに、
無料で作れる簡単なお問い合わせフォームの作り方をご紹介したいと思います。

 

ちなみに、設置したからといってメッセージがくることはほぼありません。笑

 

Googleフォームでお問い合わせフォームをつくる

 

それではこのブログでも実際に設置している
お問い合わせフォームの作り方をご紹介します。

 

※Googleアカウントを持っていることが前提になります!

 

1.Googleフォームの新規作成

 

こちらからGoogleフォームのページへアクセスしましょう。

 

下図のページが開けたら、「Googleフォームを使う」をクリック。

 

f:id:nooosk39:20190726210056p:plain

 

 

「新しいフォームを作成」から、今回は「空白」を使ってフォームを作成します。

 

f:id:nooosk39:20190726210357p:plain

 

2.タイトルの設定

 

タイトル欄には「お問い合わせフォーム」であることがわかる名前を付けましょう。
今回は特に書いていませんが、「フォームの説明」も書いてあげるとより丁寧です。

 

f:id:nooosk39:20190726211123p:plain

 

3.設問の追加

 

今回作るフォームでは

  • 名前
  • メールアドレス
  • 件名
  • 本文

の4つの設問を設置します。

 

デフォルトで設置されている「無題の質問」をクリックすると質問の編集ができます。

 

f:id:nooosk39:20190726211713p:plain

 

 

「ラジオボタン」のプルダウンをクリックし、回答形式を「記述式」に変更します。

 

f:id:nooosk39:20190726211936p:plain

 

質問の名前を「お名前」に変更し、必須回答設定もしておきましょう。

 

f:id:nooosk39:20190726212157p:plain

 

サイドバーの「+」を押すことで質問の追加ができます。

 

f:id:nooosk39:20190726212446p:plain

 

同様に「メールアドレス」「件名」欄も作成しましょう。
必須設定はお好みでどうぞ!

 

f:id:nooosk39:20190726212721p:plain

 

「本文」は「段落」で作成します。
「段落」で作成することにより、複数行入力できるようになります。

本文は必須設定しておくのがおすすめです!

 

f:id:nooosk39:20190726213357p:plain

 

4.デザインのカスタマイズ

 

右上のパレットアイコンをクリックすると、「テーマ」を変更することができます。
自分のブログに合ったカラーに変更しておきましょう。

 

f:id:nooosk39:20190726214039p:plain

 

 

5.HTMLの取得

 

別ウィンドウで先ほど作ったGoogleフォームのHTMLタグを取得しましょう。

 

①の「送信」ボタンをクリックすることでフォームを送信ウィンドウが表示されます。

②の「<>」タブをクリックし、HTMLを取得しましょう。

③の「コピー」を押せばクリップボードにコピーをしてくれます。 

 

f:id:nooosk39:20190726214559p:plain

 

 

これでフォームが完成しました。
早速はてなブログに設置してみましょう。

 

はてなブログにお問い合わせページを作る

 

1.お問い合わせ用の固定ページを作る

 

前回のプライバシーポリシーの設置でも使用した、
はてなブログProの「固定ページ」を使います。

※はてなブログ無料版やその他のブログを利用している方は通常の記事作成で作りましょう。

 

◆設定→固定ページを選択

◆URL欄に任意のURL("contact"等)を入力し、ページを作る

◆記事が作成されるのでタイトルを「お問い合わせフォーム」とする

◆「HTML編集」タブに取得したHTMLタグをペーストする

 

 

2.作成したお問い合わせフォームをサイドバーに設置する

 

お問い合わせページはできましたがまだブログには表示されていません。
 

<前回の記事でプライバシーポリシーを作っている方>

◆設定→デザイン→カスタマイズ→サイドバー→「このサイトについて」の編集

◆リンク欄2行目のタイトルに「お問い合わせ」を入力

◆URLに「作った固定ページのURL」を入力

◆「適用」

 

<はじめてサイドバーを使う方>

◆設定→デザイン→カスタマイズ→サイドバー→モジュールを追加

◆「リンク」を選択

◆タイトル欄に「このサイトについて」と入力

◆リンク欄のタイトルに「お問い合わせ」URLに「作った固定ページのURL」を入力

◆「適用」

 

以上でサイドバーにお問い合わせフォームが設置されました!

サイドバーを確認し、ページに飛べることを確認してみてください。

 

 

最後に

 

無事にお問い合わせフォームは設置できましたか?

これでまた一歩アドセンス合格に近づきました。

 

みなさんがアドセンスに合格できますように!

 

 

ブログランキング・にほんブログ村へよければ応援よろしくお願いします! 

 

★あわせてどうぞ。