Google アドセンス の申請をしてみようかなぁと思い、調べ物をしてました。
審査に一発合格している人のサイトで、どんな事をしているのか物色していると...。
多くの人が「問い合わせページの作成」をしてる事に気付きました。
私のブログには「問い合わせページ」はありません。
という事で Google 先生に頼って設置してみましたのでログっておきます。
お問い合わせフォームの作成
お問い合わせフォームは Google を使って作成します。
Google のトップページから右上にある碁盤のようなアイコンをクリックします。↓
すると Google のサービスがドロップダウンで出てきます。
「もっと見る」→「さらにもっと」
と進んでいくと「フォーム」という紫のアイコンが見つかります。
これを使うと「問い合わせフォーム」を簡単に作成できます。
これをダブルクリックすると以下のようなページが立ち上がります。↓
「Google フォームを使う」をクリックします。
すると、「スキップ」or「ガイドを見るか」確認されますがこれはどちらでも構いません。
「スキップ」すると以下のような画面が立ち上がります。↓
左上の「新しいフォームを作成」をクリック。
すると以下のようなポップアップが表示されます。
好き好きですが、
「Untitled form」には「お問い合わせフォーム」と入力。
「フォームの説明」は空欄にしました。
後は、右横のフローティングバーの一番上の「＋」を押します。
すると、追加したい項目の数を増やす事ができます。
注意事項としては、「ラジオボタン」となっている部分をクリックし、「記述式」に変更する必要があります。
私の場合は、
「名前」「連絡先」「件名」「問い合わせ内容」
の 4つにしました。
最後の「問い合わせ内容」だけは「記述式」から「段落式」に変更します。
（こうすると長文が OK になります。）
これだけでフォーム作成は完了です。
デフォルトは紫色なので、右上のパレットアイコンをクリックしてお好みの色に変更して下さい。
色の変更が終わったら、右上の「送信」ボタンを押します。
ポップアップの真ん中あたりの「＜＞」をクリックします。
すると「HTMLを埋め込む」という項目が出現します。
この HTML をコピーしておいて下さい。
前述の手順で「問い合わせフォーム」用の HTML の作成は終了しました。
次にやるのははてなブログ側の設定です。
まずは、問い合わせページを作成します。
「ダッシュボード」→「固定ページ」を選択肢、任意のページ名を入力します。↓
次に「ページ作成」をクリックするとブログ記事の作成と同じ画面が開きます。↓
上部にある「HTML編集」をクリックし、先程コピーした HTML を貼り付けます。↓
貼付け後、「みたまま編集」or「プレビュー」で確認して下さい。
こんな感じで出来上がっています。↓
グローバルナビゲーションへの貼付け
これではてなブログ側の設定も完了しました。
私のブログの中に maximal-life.work/otoiawase というページが出来上がりました。
このページのリンクをグローバルナビゲーションに貼り付けます。
「デザイン」→「カスタマイズ」→「ヘッダ」→「タイトル下」
に以下のコードを貼り付けました。
<div class="menu"><a href="https://www.maximal-life.work/otoiawase"><i class="fas fa-envelope"></i></i>お問い合わせ</a></div>
<i class="fas fa-envelope"> はアイコンを呼び出しています。
完成形は以下の通り。↓
この通り、ほとんどコードを買いたりする事なく、お問い合わせフォームの作成とグローバルナビゲーションへの設置が完了しました。
今回は以下、ウィリスさんのブログを参考にさせて頂きました。
お問い合わせフォームを作成＆はてなブログに設定する方法【図解でわかりやすく！】 - ウィリスの宇宙交信記
ウィリスさん、ありがとうございました。
↓ ランキングに参加しています。よろしければポチッとして下さい。
