HTML はメッセージでは使えません

コンタクトフォーム編集画面の「メッセージ」タブにて、Contact Form 7 がさまざまな状況に表示するのに使うメッセージを編集できるのはご存じかと思います。このメッセージ内では平文のテキストのみ使用可能です。HTML のタグや実体参照は使えません。

メッセージの中での HTML の使用を認めるのはセキュリティ上好ましくないので、Contact Form 7 4.4 以降ではメッセージを表示する際に強制的に HTML を取り除きます。「メッセージ」タブに HTML が使われていないことを確認しましょう。

もし、特定の状況に特定の HTML コンテンツを表示する目的のためにメッセージでの HTML 使用を必要としているのなら、もっといい方法があります。

フォーム送信後、Contact Form 7 は form 要素に、その時点のフォームの状態を示した class 属性値を追加します。取り得る状態は:

  1. invalid — 1個以上の検証エラーが発生している
  2. spam — 送信がスパム行為の疑いがある
  3. sent — フォーム送信は正しく行われ、メールの送信にも成功した
  4. failed — フォーム送信は正しく行われたが、メールの送信に失敗した

これらのクラスと CSS スタイルシートを組み合わせて使うことで、特定の状況でのみ表示される HTML コンテンツのブロックをフォーム内に配置することができるようになります。

例として、visible-only-if-invalid というクラスがついた div 要素をフォームに配置して、これをデフォルトでは非表示に、検証エラーが発生している状況でのみ表示する方法を考えてみましょう。

<div class="visible-only-if-invalid">
  <font color="#f00">検証<marquee>エラー</marquee>がありますよ!</font>
</div>

次のような CSS のスタイルルールで実現できます:

.wpcf7 form div.visible-only-if-invalid {
  display: none;
}

.wpcf7 form.invalid div.visible-only-if-invalid {
  display: block;
}

同様の方法で、その他の状況に基づいた要素表示の制御も可能になります。