Word Pressで最も一般的な問合せフォームプラグインだと思われるContact Form 7でバージョンアップをしたら表示がボコボコになってしまいました。
やらかしてしまったと思って原因を探って行くと
が勝手に入ってしまい、その影響でレイアウトが崩れたのだとわかりました。
対策はいくつかあってサイトの構造や使ってるプラグインによって変わるのでおすすめ順に紹介していきます。
CSSでPタグを消す
一番シンプルでリスクが少ない方法がCSSでPタグを消してしまうことです。
クラスの指定はサイトに合わせて調整してみてください。
また、display:inlineで処置していますが、inlineで効果がない場合はdisplay:noneで消してしますという方法もサイトによっては有効かもしれませんね。
参考コード
.wpcf7 p {
display: inline;
}
function.phpにPタグ無効化を追加する
CSSに追加しても効果がなかった場合にはテーマフォルダ内にあるfunction.phpにコードを追加してそもそものPタグが自動的に入るのを無効化します。
参考コード
// Contact Form 7の自動pタグ無効
add_filter('wpcf7_autop_or_not', 'wpcf7_autop_return_false');
function wpcf7_autop_return_false() {
return false;
}
wp-config.phpにPタグ無効化を追加する
wp-config.phpはWordPress直下にあります。WordPress全体に影響を及ぼすため手を加えるのは多少危険性がありますが、最後の手段としてはこの方法がいいと思います。
このコードをwp-config.phhpに追加することでPタグを無効化することが出来ます。
// Contact Form 7の自動pタグ無効
define ('WPCF7_AUTOP', false);
この方法には一つだけ注意点があります。wp-config.phpファイルには最終行に下記のようなコードが書かれていると思います。
追加タグはここよりも上にいれるようにしてください。
/** Sets up WordPress vars and included files. */
require_once( ABSPATH . 'wp-settings.php' );
まとめ
Word Pressの問合せフォーム(Contact Form7)で表示が崩れたらまずはPタグが勝手に入っていないかを探ってみましょう。
そしてPタグが原因であればCSSで無効化したり、function.phpやwp-config.phpにタグを追加してPタグの自動挿入を無効化して対処しましょう!
コメント