調べ物

WordPress contact-form7の使い方

 

超メジャーなコメントフォームプラグインcontact-form7を使用してみた際の覚書。

 
以下のURLからプラグインをダウンロードし有効化する。
 
57cc0e91-b3bf-4c39-8f72-f246c39b50ee
メニューに「お問い合わせ」という項目が出現する。7c4bf379-46b3-4341-add8-59a10a2c4c2d
ショートコードをゲットする。ここでは以下の様になっている。
[contact-form-7 id="68" title="コンタクトフォーム 1”]
 
2db1d745-8b3f-49e7-add5-94aa5961665d
固定ページに「お問い合わせ」の様なページを作成し、先程のコードを記載する。
作成した固定ページを表示し、テスト送信してみる。
 
fb23b58c-a20c-4472-8b4d-e6eaae916ff6
お見事。
もう少し項目を増やして見る。
例えば電話番号の項目を増やすとする。
 
978ef7d0-e4f0-43db-9bcb-4e8ba28b2a02
 
8ea36ddc-5054-4c44-b305-b980bbce33a0
1:送信先のメールアドレス
2.差出人のアドレス
3.メールの件名
4.追加ヘッダー 「Cc: test01@example.com」「Bcc: test01@example.com」また複数の場合は「Bcc: test01@example.com, test02@example.com」の用に記述する
5 本文 HTMLで<dl><dt><dd>で囲むとデザインがしやすくて良い。
 

サンクス画面の設置

 
固定ページに新たに確認ページを作成、これをthanksとスラッグをつけ、フォームページ(/contact)の小ページにする(/contact/thanks)。
 
8d13d3df-0027-499a-9976-3b1573ff8823
9244cf95-e045-406f-814f-5fe81e48e6ad
問い合わせに戻り、その他設定タブに以下を記述する 。
on_sent_ok: 'location.replace("/contact/thanks/");'
 
これでメッセージ送信が行われると、thankページに移動することができる。
 
ContactForm7には確認画面が無い。確認画面を付属させる拡張プラグインも出ているが、初めから備え付けているフォームを使うほうがメンテの観点からおすすめ。
 
MW WP Form — WordPress Plugins - https://ja.wordpress.org/plugins/mw-wp-form/
 

-調べ物