【超初心者】はてなブログProにしてやってみたこと(お問い合わせフォーム)
Googleフォームではてなブログに設置していくのが簡単そうなので、
こちらでお問い合わせフォームを設置していこうと思います。
- お問い合わせフォームの作成
- お問い合わせフォームの設定
- お問い合わせフォームのテーマをカスタマイズ
- お問い合わせフォームの回答設定
- はてなブログへ設置
- 固定ページの作成
- はてなブログへのお問い合わせフォームへのリンク
お問い合わせフォームの作成
Googleアカウントが必要なので、まだ持っていないという方は作成してから下記の手順で進めてください。
Googleアプリを開きます。(丸が9個四角に並んでいるボタンです)
その他のソリューションを開きます。
こちらのフォームを使用して作成していきます。
トップページのgoogleフォームを使ってみるをクリックします。
新しいフォームを作成
「無題のフォーム」のところを書き換えることができます。
“お問い合わせ”等お好みで変更してください。
次に、お問い合わせ者に入力してもらう項目を作成していきます。
「無題の質問」を「お名前」に変更してください。
右側にある、「ラジオボタン」となっている箇所の▼をクリックしてください。
ここで、入力形式を選ぶことができますので、「お名前」を入力してもらう場合は“記述式”に変更してください。
右側の+ボタンを押すと、質問項目が追加されます。
先ほどと同じように、お好みで項目を追加します。
・メールアドレスは「記述式」
・件名は「記述式」
・本文は「段落」
上記3点は追加していたほうが良いかと思います。
右下の「必須」という箇所をクリックすると、選択している項目を入力必須項目にすることができます。
お問い合わせフォームの設定
右上にある歯車のマークをクリックしてください。
設定の画面でプレゼンテーションのタブをクリックしてください。
「別の回答を送信するためのリンクを表示」のチェックははずしてください。
「確認メッセージ」とは送信が終わった後に表示するメッセージのことです。
「お問い合わせいただきありがとうございます。」など、送信してもらった後に自動で届く文章を入力します。
設定が終わったら右下の「保存」ボタンをクリックしてください。
お問い合わせフォームのテーマをカスタマイズ
先ほどの設定の近くにあるパレットのようなアイコンをクリックしてください。
右側に「テーマオプション」が出てきます。
ここから「ヘッダー」「テーマの色」「背景色」「フォントスタイル」の項目を変更することができます。
お問い合わせフォームの回答設定
「質問」タブから「回答」タブに切り替えてください。
右側にある縦になった三点リーダーをクリックしてください。
「新しい回答についてのメール通知を受け取る」をクリックしてチェックしてください。
これで回答があればメールで通知がくるようになります。
はてなブログへ設置
まずタグを取得します。
右上の「送信」ボタンをクリックします。
「フォームを送信」という画面が出てきます。
その中の「<>」というタブをクリックしてください。
右下の「コピー」ボタンをクリックするとコードがコピーできます。
次にはてなブログに張り付けます。
はてなブログの「記事を書く」から「HTML編集」のタブをクリックしてください。
そこに先ほどコピーしたコードを貼り付けます。
編集オプションからカスタムURLを「contact」にします。
最後に「公開する」をクリックすれば完了です。
固定ページの作成
固定ページとは、最新記事として掲載するのではなく、固定のURLだけで見れるページです。
ダッシュボードから「固定ページ」をクリックすると以下のような画面になります。
「 ページを作る」で作成していきます。
先ほどの【はてなブログに張り付ける】で行った作業をここでやります。
フォームを作成した際の「<>」というタブでコピーしたコードを「HTML編集」の記事に張り付けてください。
はてなブログへのお問い合わせフォームへのリンク
ページ管理の「記事を見る」のタブを開いてください。
お問い合わせフォームを作成した記事が開きます。
画面のURLをコピーしてください。後で使用します。
ダッシュボードからデザインのページに入り、カスタマイズを開くと「サイドバー」が出てきます。
モンジュールを追加します。
モンジュールを追加することにより、サイドバーの項目を増やすことができます。
リンクを開きます。
タイトルに「お問い合わせ」とか「ご質問はこちら」などお問い合わせフォームのタイトルをつけます。
リンクのタイトルところに「お問い合わせフォーム」と入れます。
その横に先ほどコピーしたお問い合わせフォームの記事のURLを張り付けてください。
必ず適用ボタンを押してください。
変更を保存するを押してください。
このようにサイドバーにちゃんと表示されていれば設置は完了です。
いつかはGoogleアドセンスに合格できればと思っているので作ってみました。
ついでにプライバシーポリシーもつけてみました。
先輩ブロガーさん!!
Googleアドセンスに合格する秘訣を教えてください!!!
↓ポチッと応援お願いします。