KUSU'S SITE
2016年5月16日

【WordPress】Contact Form 7の応答メッセージボックスなどを非表示にする方法とは

  

 WordPressのプラグインに、Contact Form 7というお問い合わせフォームを設置できるプラグインがあります。
このプラグインをいろいろカスタマイズすれば、コーポレートサイトでも使えるぐらい重宝できるプラグインになります!

ちなみに当サイトのお問い合わせページもこのプラグインを使っているのですが、デフォルトだと下の画像のように送信が完了した時に応答メッセージボックスが表示されます。

contact

コーポレートサイトで上のようなメッセージが表示されてしまうと、ちょっと見栄え的にもよろしくない場合が出てきてしまいます。

なので、そんな時にはCSSで応答メッセージボックスおよびそれに付随するものを非表示にすることで対処することが可能になります!

今回はそのCSSについてご紹介したいと思います!

送信中の時に表示されるロードマークを非表示にするCSS

 Contact Form 7で送信ボタンを押すと、送信中の時にロードマークが表示されます。
このロードマークを非表示にするCSSが下になります。

div.wpcf7 .ajax-loader {
	display: none !important;
}

応答ボックスメッセージを非表示にするCSS

 続いて応答メッセージボックスを非表示にするCSSは下になります!

.wpcf7-mail-sent-ok {
	display:none !important;
}

まとめ

 上記で紹介したCSSを記述することで、ロードマークと応答メッセージボックスを非表示にすることができるので、コーポレートサイトなどでも使用できるようになるのではないかと思います!

Conact Form 7は様々なカスタマイズがあるので、是非ともいろいろ試してみてはいかがでしょうか??

スポンサーリンク
スポンサーリンク

コメントを残す




CAPTCHA


スポンサーリンク

ホームページ制作について

ホームページの制作依頼希望の方
はまず↓をクリック!
ホームページの制作依頼希望の方はまず↓をタップ!
サービスの詳細

WordPress講習会について

WordPress講習会について
気になる方ははまず↓をクリック!
WordPress講習会について気になる方はまず↓をタップ!
サービスの詳細

TWITTER


ページトップに戻る