ぽちゃうさ、ブログはじめるってよ。

ブログ初心者のお菓子レシピときどき雑記ブログ

【実録】パソコン初心者でもできる「お問いあわせページ」の作り方について

  f:id:pochausa:20210519203734j:plain

 こんにちは、ぽちゃうさです!

今回はブログをやる人は絶対必須項目と言われる「お問いあわせページ」を作りました!!

「おおお…なんかよく見るやつや!」ってなりました(笑)

ここから思いがけないチャンスがやってくるそうなので、設置していない人は是非設置してみてください!

また、このお問いあわせフォームはブログ以外にもホームページを作るときなどにも活躍しそうなので、参考に見てもらえればうれしいです。

では、早速やっていきましょう!

 

Googleフォーム」でお問いあわせページを作る手順

1)「Googleフォーム」の公式ページ(https://www.google.com/intl/ja_jp/forms/about/)にアクセスし、Googleアカウントでログイン

「パーソナル」と「ビジネス」が出てくるので「パーソナル」のほうをクリック

 

2)「新しいフォーラムを作成」で一番右の「空白」をクリック

 

3)クリックするとフォーラム作成画面になる

「無題のフォーム」を「お問いあわせ」に変更する

「無題の質問」を「お名前」に変更して、「ラジオボタン」を「記述式」にし、右下の「必須ボタン」をONにする

右にある「⊕(質問を追加)」をクリックして質問を追加する

*今回は「返信用アドレス」「件名」「お問い合わせ内容」「ブログ内での引用OKかNGか」の4つの項目を作りました

*「返信用アドレス」「件名」「お問い合わせ内容」は「お名前」を全く同じ手順

「ブログ内での引用OKかNGか」は「ラジオボタン」のまま下にある「オプション1」を「OK」にし、その下の「選択肢を追加」を「NG」に変更する

 

4)右上の「👁(プレビュー)」を確認し、大丈夫そうならプレビューを閉じて、右上の「送信」ボタンをクリック

 

そうすると「フォームを送信」という画面が出てきます。

これは「このフォームをどこに貼り付けるのか」という確認画面になります。

貼り付け方法を2つご紹介します。

 

5-1)リンクをコピーしてブログに貼り付ける方法

これは「お問いあわせフォームはこちら」という文字にURLがリンクされ、作成したページへ飛ぶ方法です

「送信方法」の真ん中にある「🔗」をクリック

表示されたリンクの下のURLをコピーする

自分のブログの「ダッシュボード」→「デザイン」→「工具マーク」→「サイドバー」を開き、サイドバーの「モジュール追加」から「HTML」を選択し、次のコードを貼り付ける

〈a href="お問いあわせフォームのリンクURL”〉お問いあわせフォームはこちら〈/a〉

 

5-2)HTMLの埋め込みコードをコピーして記事として公開する方法

これはお問いあわせのページを丸ごとブログ内に埋め込む方法です

「送信方法」の右にある「〈〉」をクリック

表示された「HTMLを埋め込む」の下のURLをコピーする

新規記事を書く場面で「HTML編集」タブをクリックして貼り付けて公開する

https://docs.google.com/forms/d/e/1FAIpQLSdF8_9uaMEsBYV3Xmd-3w-peoQkNTmQGMr-jY1qmtEi6pYjVg/viewform?usp=sf_link

 ↑これをクリックすればすぐお問い合わせページが開けます

 

以上2つがGoogleフォームでつくったお問い合わせページをブログにリンクさせる方法です!

わたしはとりあえずどちらの手順もやってみました。

ここから思いがけないチャンスが舞い込んできますように☆彡

(レシピ本やブログが成功した私へのインタビュ―とかとかいいですねぇ笑)

 

では今回はこのへんで。

最後までお読みいただきありがとうございました!それでは✋

 

 

新品も中古も激安PC勢ぞろい!パソコン買うなら楽天市場 https://rpx.a8.net/svt/ejp?a8mat=3HA21R+DRY3OY+2HOM+6FP1V&rakuten=y&a8ejpredirect=http%3A%2F%2Fhb.afl.rakuten.co.jp%2Fhgc%2F0ea62065.34400275.0ea62066.204f04c0%2Fa21042183841_3HA21R_DRY3OY_2HOM_6FP1V%3Fpc%3Dhttp%253A%252F%252Fwww.rakuten.co.jp%252F%26m%3Dhttp%253A%252F%252Fm.rakuten.co.jp%252F