はてなブックマーク

追加設定 “on_sent_ok” はフォーム送信が完了しメールの送信にも成功した時に実行される JavaScript コードを割り当てるために使用されるものです。ウェブアナリティクスサービスでフォーム送信をトラッキングしたり、フォーム送信後に異なるページにリダイレクトさせる用途でよく使われます。 “on_sent_ok” とその兄弟設定 “on_submit” は非推奨となっており、2017年末までに廃止される予定です。これらの設定を使うことが即危険だということではないですが、万が一このプラグインやあるいはあなたのサイトの他の部分に脆弱性があった場合にリスクを増大させる可能性があります。より安全な代替方法に置き換えるべきです。 続報: on_sent_ok と on_submit は Contact Form 7 5.0 で正式に削除されました。 推奨される on_sent_ok の代替

Contact Form 7 4.6 が公開されました。もうすぐ公開される予定の WordPress 4.7 との互換性があり、また数多くの新機能と機能向上が含まれています。 WordPress 4.7 対応 新しい WordPress 4.7 の公開が近日中に予定されています。数ある 4.7 のハイライトのなかで私が最も魅力を感じているのがユーザーの管理画面言語の機能です。これにより各ユーザーが自分の好きな言語で管理画面を使うことができるようになります。 これにより、ローカライズされたコンタクトフォームが以前より簡単に作成できるようになります。多言語化プラグインなしでも可能です。単にプロフィールページで管理画面の言語を選んでそれから新しいコンタクトフォームを作ればいいだけです。 翻訳は translate.wordpress.org から供給されます。ダッシュボード > 更新 メニューで

承諾確認チェックボックスは特定の条件への送信者の同意を確認する目的に特化したシンプルなチェックボックスです。Contact Form 7 は承諾確認チェックボックスのために acceptance フォームタグを提供しています。 コンタクトフォームで承諾確認チェックボックスを使うには、[acceptance] フォームタグをフォームタブパネルの入力項目に次のように入力します: [acceptance your-consent] 私はこの条件に同意します。 [/acceptance] 他のタイプのフォームタグとは異なり、[acceptance] タグはその末尾に閉じタグ ([/acceptance]) を持つことに注目してください。開始タグと閉じタグの間にある部分はそのフォームタグの内容です。承諾確認チェックボックスのフォームタグに内容が指定された場合、内容は同意を求める条件文として解釈されま

Posts in the developer's cookbook category describe topics that require technical knowledge. Be warned and use the techniques at your own risk. Unless you are an experienced developer, you are strongly advised to ask a professional for support. Contact Form 7 provides several kinds of user-input validation by default, including: Is a required field filled in?Does an email field have an email addre

はい。Contact Form 7 3.4 以上からこれらの HTML5 入力タイプに対応したフォームタグをサポートします: email、tel、url、number、range、date。 HTML5 の入力タイプを使いたくない場合は、次のコードをテーマの functions.php ファイルに追加することで無効化できます: add_filter( 'wpcf7_support_html5', '__return_false' ); 最新のブラウザでも HTML5 の全機能をサポートしているわけではないのでご注意ください。例えば最新の Firefox でも date 入力タイプ(カレンダーから日付をピックアップする UI)や number 入力タイプ(数値を入力するスピンボックス型 UI)をまだサポートしていないため、カレンダーやスピンボックスの UI の代替として一般的なテキスト入力フ

Contact Form 7 4.4 がリリースされました。たくさんの改良が行われていますのでお早めの更新をお勧めします。 設定検証 これまで考えられていた以上に多くのユーザーが誤った設定を行っており、その結果、メール配送の失敗などの重大なトラブルを引き起こしていることが、ここ数ヶ月の調査でわかってきました。 この問題を少しでも小さくするために、Contact Form 7 4.4 では設定検証の機能を導入しました。これを使うことで、コンタクトフォームの設定を検証し、エラーを検出することが可能になります。 translate.wordpress.org への移行を開始 translate.wordpress.org へ段階的に翻訳を移行するプロセスを開始しました。このリリースの直前に、7言語(日本語、ハンガリー語、オランダ語、アゼルバイジャン語、ポルトガル語、クロアチア語、スウェーデン語)

This page is also available in English. reCAPTCHA はスパムやその他の自動化された嫌がらせからあなたを守ります。Contact Form 7 の reCAPTCHA インテグレーションモジュールを使えば、スパムボットによる不正なフォーム送信を遮断できます。 reCAPTCHA API の現在の最新バージョンは v3 です。バージョン 5.1 以降の Contact Form 7 はこの reCAPTCHA v3 API を使用します。reCAPTCHA v3 は人目につかないバックグラウンドで仕事をするので、これまでのように画像の中のぼやけたテキストを読ませたり、「私はロボットではありません」のチェックボックスを選択させたりする必要がなくなります。 注意: reCAPTCHA v3 と v2 の API キーはそれぞれ別のものです。v2 のキ

はい。でも、コンタクトフォームのショートコードをテンプレートファイルに直接挿入することはできません。ショートコードを apply_shortcodes() 関数に引数として渡して、その出力を表示する必要があります。次のように: <?php echo apply_shortcodes( '[contact-form-7 id="1234" title="Contact form 1"]' ); ?>

Contact Form 7 は送信されたメッセージをどこにも保存しません。ですから、もしメールサーバーに問題があったり、メールの設定に間違いがあったら、大事なメッセージを永久に失うことになるかもしれません。 そんなことになる前にメッセージ保存プラグインをインストールしましょう。Flamingo がコンタクトフォームから来るすべてのメッセージをデータベースに保存します。Flamingo は Contact Form 7 と同じ作者により作られた無料の WordPress プラグインです。 » WordPress.org から Flamingo プラグインをダウンロード メッセージの件名と送信者欄をカスタマイズする 受信メッセージ管理メニュー内に件名と送信者の欄があり、それぞれメッセージの件名、送信者の名前とメールアドレスが入ります。 デフォルトではこれらの項目は Contact Form

デフォルトの設定では、Contact Form 7 はその JavaScript と CSS スタイルシートをすべてのページにロードします。きっと、こんな無駄の多いやり方をやめて、コンタクトフォームを含むページにだけロードすればいいのに、と考えていることでしょう。その気持ちはよくわかりますが、技術的な困難があって、ページをロードする時点でそのページがコンタクトフォームを含んでいるかどうかを判断することがプラグインにとって難しいのです。ともあれ、多少状況を良くするような方法を提示することならできなくもありません。 ステップ 1: すべてのページで JavaScript と CSS スタイルシートをロードしないようにする 定数 WPCF7_LOAD_JS の値が false の場合(デフォルト値は true)、Contact Form 7 は JavaScript のロードを行いません。次のよ

どうやってコンタクトフォームのスタイルを指定するの？ というのがサポートフォーラムの定番の質問です。Contact Form 7 はスタイル指定のためのカスタマイズ機能を提供しません。CSS のスタイルシートを編集するのがコンタクトフォームにスタイルを適用する最善の方法です。この記事ではコンタクトフォームのスタイル指定のための重要なステップについて解説します。CSS について詳しい方にとっては難しくないはずですが、まだよくわかっていないという方はまず先に CSS について勉強してください: Learning CSS – W3CCSS Tutorial – W3SchoolsLearn CSS | MDN – Mozilla Developer NetworkCSS Basics どのスタイルシートを編集するべきか どのスタイルシートでも構いませんが、お勧めはお使いのテーマのメインのスタイル

This page is also available in English. あなたの WordPress サイトにアカウントを持っているユーザーを対象としたコンタクトフォームを作ることもあるでしょう。その場合、そのユーザーの基本情報(名前、メールアドレス等)はすでに持っているので、それをユーザーに質問するのは冗長になります。

This page is also available in English. Jetpack は人気のあるプラグインで、WordPress.com が提供するたくさんの機能を通常の WordPress で利用可能にするものです。私自身も Jetpack を愛用しています。 ですが残念なことに、Jetpack 1.3 から新たに導入されたコンタクトフォームモジュールが、Contact Form 7 を含む他のコンタクトフォームプラグインと衝突してしまうことがわかっています。 典型的な問題としては、他のプラグインのコンタクトフォームのショートコードを Jetpack がハイジャックするというものがあります。この結果、あなたのカスタマイズしてあるコンタクトフォームが Jetpack の質素なコンタクトフォームに置き換えられてしまい、それから送信されたメッセージもどこか意図しない宛先に送られてし

コンタクトフォーム経由で送られてくるスパムや好ましくないメッセージに迷惑していて、CAPTCHA や Akismet を使っても完全にはブロックできない、そんなときには禁止用語リストが役に立ちます。 禁止用語リストは元々は WordPress の機能ですが、Contact Form 7 もリストを使って特定の単語や IP アドレスを弾くことができます。 使い方は簡単です。WordPress の管理画面にログインしたら、設定 > ディスカッションのメニューに移動、その中頃にコメント内で許可されないキーワードという項目があります。 The Disallowed Comment Keys section in Settings > Discussion 単語か IP アドレスを一行に一個ずつ、テキストボックスに入力してください。作成したリストに含まれる単語を含む、または IP アドレスから送信さ

ブログの訪問者がコンタクトフォームで送信すると、その訪問者は「あなたのメッセージを送信しました」とか「入力内容に不備があります」といった Contact Form 7 からの応答メッセージを目にすることになります。これは時々ユーザーから指摘を受けることですが、この応答メッセージを表示する位置がよくないために、訪問者がたびたびこのメッセージを見落としてしまうのだそうです。 この応答メッセージはデフォルトではフォームの最下部に表示されます。この場所を、応答メッセージのためのプレースホルダー [response] を設置することで変更が可能です。この [response] タグをフォーム内の好きな位置に置いてください。複数設置することもできます。これで応答メッセージはフォーム送信後にこのプレースホルダーの位置に表示されるようになります。 デモ 注意: これはデモです。このフォームが実際にメールを

This page is also available in English. デフォルトの設定では、subscriber (購読者) を除いたすべてのユーザーが Contact Form 7 の管理パネルにアクセスすることができ、また、administrator (管理者) と editor (編集者) にはさらにコンタクトフォームの編集権限が与えられています。この設定を変更して権限の割り当てをより限定的にしたいと思うこともあるかもしれません。この記事ではその方法について説明します。 例として、administrator のみにアクセスと編集の権限を与える設定変更について見てみましょう。wp-config.php ファイルを編集して次の行を挿入します: define( 'WPCF7_ADMIN_READ_CAPABILITY', 'manage_options' ); define( '

コンタクトフォームから入力されたテキスト以上の情報が必要になるときもあるでしょう。たとえば、セキュリティ上の理由で送信者の IP アドレスを知りたいというような場合です。そういった目的には特別なメールタグが役に立ちます。 その他のメールタグとは異なり、特別なメールタグはフォームの入力項目や送信者が入力する内容からは独立しています。特別なメールタグはメールタグを使える場所ならどこにでも設置できます。たとえばメッセージ本文やその他のメール項目の中などです。 送信関連の特別なメールタグ [_remote_ip] — このタグは送信者の IP アドレスで置き換えられます。 [_user_agent] — このタグは送信者のユーザーエージェント(ブラウザ)情報で置き換えられます。 [_url] — このタグはコンタクトフォームが設置されているページの URL で置き換えられます。 [_date] —

スパマーはあらゆる対象をターゲットにします。あなたの問い合わせフォームも例外ではありません。 Contact Form 7 はさまざまなスパム対抗モジュールを用意しています。異なるタイプのモジュールを複数組み合わせて使うのがおすすめです。 Akismet は Automattic が提供する強力なアンチスパムサービスです。Akismet によるスパムフィルタリングは Contact Form 7 の対スパム戦略の要をなします。 Akismet を有効化する 情報開示: この投稿の作成者は Automattic アフィリエイトです。これは、文中のリンクを通じてあなたが何かを購入した場合に、投稿作成者が手数料収益を得ることを意味します。 最初のステップは Akismet プラグインを有効化することです。Akismet のプラグインパッケージは WordPress に同梱されているので、わざわざ

Contact Form 7 doesn’t store submitted messages anywhere. Therefore, you may lose important messages forever if your mail server has issues or you make a mistake in mail configuration. Install a message storage plugin before this happens to you. Flamingo saves all messages through contact forms into the database. Flamingo is a free WordPress plugin created by the same author as Contact Form 7. » D

テキスト入力項目はコンタクトフォームの最も基本的な要素です。HTML はテキスト入力項目のための2種類の要素を持っています。単一行入力のための <input type="text"> と複数行入力のための <textarea> です。 Contact Form 7 ではこれら2種類の HTML 要素を表現する数種類のフォームタグを用意しています: テキスト項目 (text と text*)、メールアドレス項目 (email と email*)、URL 項目 (url と url*)、電話番号項目 (tel と tel*)、テキストエリア (textarea と textarea*)。この記事では、これらのフォームタグの詳細な使用方法とセマンティクスについて説明します。 テキスト項目 text と text* はどちらも単一行入力のために用いられ、任意の形式のテキストを受け入れます。違いは

This page is also available in English. あなたが会社のサイトのウェブマスターになった場面を想像してください。そのサイト上に、送信者が宛先を選択できる仕組みのコンタクトフォームを設置することになったとしましょう。わかりやすい例として会社の CEO (ceo@example.com)、営業担当(sales@example.com)、サポート担当(support@example.com) の3つから宛先を選択できることにします。 こういったコンタクトフォームは、Contact Form 7 の基本的な機能を使っても実現することは可能でした。まずドロップダウンメニューかラジオボタンを設置して(つまり次のようなフォームタグをフォームのテンプレート内に挿入するわけですが): [select your-recipient "ceo@example.com" "sa

まず、これから書こうとしている内容は 99.99% のユーザーにとって必要のないものであり、実際、使用を推奨しないものだということを始めにお断りしておきます。これは 0.01% のユーザーを対象に書いていますので、必要がなければ無視して構いません。 ご存じのように、デフォルト設定の Contact Form 7 はフォーム送信後にそのフォームの URL と同じ URL にリダイレクトします。ところが、非常にまれなケースですが、これを変更して送信後に異なる URL に対してリダイレクトさせるようにする必要が生じるかもしれません。ここでは、そのような動作を実現するための Contact Form 7 の設定方法について説明します。 ところで、いわゆる「サンキューページ」にリダイレクトさせるにはどうしたらいいかという質問がよくユーザーから送られてきます。彼らは Google Analytics

サイトのトラフィックを Google Analytics で監視しているなら、同様にフォーム送信も追跡したいと思うでしょう。この記事では Google Analytics 4 (GA4) でフォーム送信イベントを追跡する方法について解説します。 注意: この記事では Google Analytics の基本的な使い方に関する説明は行いません。まだ Google Analytics についてよく知らない方は先に Google の資料をご参照ください。Google の Site Kit プラグインを使えば GA4 の導入と WordPress サイトでのセットアップを簡単に行うことができるでしょう。 イベント追跡 Google Analytics にイベントを送信するには gtag() 関数をコールします:

Contact Form 7 はチェックボックス、ラジオボタン、それからドロップダウンメニューを表現するフォームタグをいくつか用意しています。この記事では、それらのフォームタグの詳細な使用方法とセマンティクスについて説明します。 チェックボックスとラジオボタン checkbox と checkbox* はどちらもチェックボックス (HTML における <input type="checkbox">) のグループを表現します。checkbox* はユーザーに対して、少なくともひとつのチェックボックスを選択することを求めます。 radio はラジオボタン (HTML における <input type="radio">) のグループを表現します。入力必須版の radio (“radio*”) はありません。Contact Form 7 が “radio*” を提供しない理由は、そもそもラジオボタ