30代からの資産ブログの作り方

【資産ブログ】Contact Form 7によるお問い合わせフォームの設置方法

こんにちわ

 

WordPressには最初からお問い合わせフォームを作る機能がありません。

ならばなるべく簡単に作る方法として「Contact Form 7」を使う方法を紹介します。

このContact Form 7は日本製で人気も高いので、まずこれで作るのが間違いないかなと思います。

 

 

Contact Form 7とは?

Contact Form 7とは、その名の通りお問い合わせフォームを作るためのWordPressプラグインです。

とても人気があり、沢山の人に使われているだけあって、機能や使い勝手が充実しています。

お問い合わせフォームが作りたいけどどうしようか迷っている人は、とりあえずこのプラグインを試してみて下さい。

 

 

お問い合わせフォームの作り方

まずは簡単に、とりあえず使える状態にしてしまいましょう。

細かい設定もありますが、それは後日でも公式HPを見て下さい。

 

1.まずはプラグインのインストール

まずはプラグインをインストールします。

「Contact Form 7」と検索すれば出てくるはずです。

インストールしたら有効化しましょう。

 

 

2.配置

公式HPやいろいろなブログ等には、「固定ページで使うと簡単」と書いてあります。

しかし、個人的にはウィジェット(プロフィールとか過去の記事とかが書いてある枠の部分)に設定するのが簡単でした。

このブログも、PCで見れば右側に、スマホで見れば下の方にフォームがあります。

ですので、今回はウィジェットに設置する方法を解説します。

 

プラグインを有効化すると、左側のダッシュボードメニューの中に「お問い合わせ」があるはずです。

まずはそれを開いて、デフォルトで出来ているコンタクトフォームを確認して下さい。

 

これは各テーマによって書き方が違いますが、そのまま先ほどのデフォルトで存在していたコンタクトフォーム1にある下のコードをそのままコピーして下さい。(下のコードは例です。id="○○○○"の部分が違いますので注意です。)

     

    このままだと、問い合わせの記述欄のサイズが大きすぎたり小さすぎたりしているはずです。

    簡単に直りますので、直しましょう。

    下の画像の様に、コードの後ろにサイズを記入します。

    “35x20”とありますが、35は横幅です。20は高さです。

    真ん中の“x”は小文字のX(エックス)を入れます。

    実際にプレビューを見ながら最適な大きさを見つけてくださいね。

     

     

    以上で配置は終わりです。

     

    3.スパム対策でAkismetを使用している場合は連携

    スパム対策として、Akismetを使用している場合はすぐに連携しましょう。

    Akismetって何?という人は、とりあえず飛ばして下さい。スパム対策が出来るプラグインです。

     

    連携方法は簡単で、コンタクトフォームのコードに1文追加するだけです。

    ・フォームに名前の記入欄がある場合

    text* your-name akismet:author

     

    ・フォームにメールアドレスの記入欄がある場合

    email* your-email akismet:author_email

     

    ・他に記入欄がある場合

    xxxxx your-xxxxx akismet:author_xxxxx

     

    記入は下の画像のようになります。

     

    以上でAkismetとの連携は完了です。

     

     

    これでお問い合わせフォームは(とりあえず)完成です。

     
    PR