AFFINGER5にGoogleフォームでお問い合わせ設置【5分】その理由とは？

悩みを持つブロガー

Googleフォームで作るように勧められました。
Contact Form 7ではだめでしょうか？
理由を教えてください。
設定方法もお願いします。

こんにちは！　　スズヒロです！はい、しっかりご説明します！

スズヒロ

本日の記事内容

記事の信頼性

　WordPress有料テーマならAFFINGER

＼STINGERタグ管理プラグイン3無料特典／

 

きっと友達に自慢したくなります。

 

関連記事【Suzue Blogデザイン】アフィンガーのおすすめカスタマイズです！

早速スタートしましょう。
 
 

Googleフォームで作成する理由

 
以下の3点があるからです。

どのポイントも深堀すれば解決方法を見つけることができますが、その時間があれば記事執筆に充てたいものですよね。

表示速度遅延を防ぐ

 
それぞれサイトを調査すると解決方法があるようですが、そのために時間を割くのはもったいないです。
 

ブログテーマとの干渉を防ぐ

 
これいつもそうですが、干渉が起きることがあります。プラグインの何がテーマと干渉しているかを見つけるも案外時間がかかりますから。
 

プラグインは必要最小限に

 
便利だからと言ってプラグイン入れすぎると重くなります。

出来るだけ必要最小限にすることをお勧めします。
 

わたしのお問い合わせフォームです

早速のこのフォームの作成方法をご説明します。

Googleフォームでお問い合わせフォーム作成する

では「Googleフォーム」のサイトにいきます。

Googleフォームを使ってみるをクリックしましょう。

次は：

すでにGoogleにログインされている方は

まだGoogleにログインされていない方は

ログイン画面からログインしてください。

まだGoogleのアカウントをお持ちでない方は

Googleのアカウントを作成してログインしてください。

ステップ1

矢印をクリックします。

この画面が出ます。

各番号に以下のように入力します

ステップ2

上記と同じ要領でフォームを追加します。

②③④と追加します。

ステップ3

フォームのデザインを設定します。

いろいろできるようですが、終了したら「送信」を押しましょう。

これが表示されます。

ここの矢印を押すとコードがでますのでコピーしましょう。

ステップ4

次にあなたのブログの管理画面から「固定ページ」「新規追加」と進みましょう。

入力画面に先ほどコピーしたコードを張付けて終了です。

タイトルに「お問い合わせ」と入れるとGoogleフォームのお問い合わせとダブります。

これで終了です。

そうでしたテスト送信してみましょう！

Googleフォームのこの画面にこのように表示されれば成功です！

フォームを少しカスタマイズする

スクロールバーの消去

固定ページにコピペしたGoogleフォームのコードを確認してください。「読み込んでいます」の直前に以下を加えてください。

スクロールバーと高さ調整

もう一度コードを確認してください。

このようになります。

まとめ

いかがでしたか？

モバイルファーストの時代です。

表示が遅かったりするとすぐに離脱されてしまいます。また、テーマとプラグインの干渉がおきることがあります。

なのでプラグインは出来るだけ少なくしておきましょう。

サクッと簡単に設置できます。そしてすぐ執筆に集中できます！　是非トライしてみてください。

本日は以上になります。