今回はAffinger5でお問い合わせフォームを作成する方法について紹介します。
プラグインを使用すれば、簡単に作成することが可能です。
お問い合わせフォーム作成するまでの大まかな流れ
- Contact form7のプラグインをインストールする
- Contacf Form7の設定からお問い合わせフォームの新規作成をする
- 作成したお問い合わせフォームのショートコードを新規ページに貼り付ける
- ページをサイトに設置する
目次
手順1.プラグインをダウンロードする
まずはContact Form7というプラグインをダウンロードします。
プラグイン > 新規追加 > Contact Form 7を検索 >インストール＆有効化
手順2.お問い合わせフォームを設定&作成する
Contact Form 7の設定画面を開きます。
プラグイン > インストール済みプラグイン>Contact Form 7の設定をクリック
新規追加をクリック
次に設定を行っていきます。
基本的に以下の3つを行えばOKです。
- タイトルを入力
- メール > 自分のメールアドレスを入力
- 保存する
メモ
- タイトルはサイトに公開されるものではないので、自分が分かりやすいようなタイトルでOKです。（例:お問い合わせフォーム等）
- お問い合わせメッセージを受け取るための自分のメールアドレスを入力します。ここで使うメールアドレスは、普段自分が使っているのとは別にブログ用に用意しておくのがオススメです。
- 他の項目は特に変更しなくてもOKです。変更したい箇所があれば各自カスタマイズして下さい。
手順3.ショートコードを新規固定ページに貼り付ける
コンタクトフォームを作成し、保存をしたらショートコードが表示されます。
ショートコードをコピーする
次にショートコードを新規固定ページにコピーします。
固定ページ> 新規追加 > ショートコードをペーストする
- 固定ページの題名は「お問い合わせ」などユーザーにも分かりやすいようにします。
- パーマリンクは〇〇.com/contactなどがオススメです。
- プレビューで確認＆公開します。
手順4. サイトに設置する
次に、お問い合わせページを見えやすいところに設置します。
下の画像のように、サイトのグローバルメニューに設置してみましょう。
- 外観 > メニューを開く
- グローバルメニューを選択
- 固定ページから先ほど作成したお問い合わせページをメニューに追加する
- 好きな位置に配置する
- メニューを保存する
最後にサイトのメニューからお問い合わせページにアクセスできるかを確認しましょう。
これでお問い合わせページの設置は完了です。
おまけ: お問い合わせボタンの色を変更する方法
Affinger5を使用している場合は、カスタマイザーからボタンの色を変更することが可能です。
WordPress管理画面から外観 > カスタマイズ > オプションカラー>コンタクトフォーム7送信ボタン
