「contact form 7」のチェックボックスを改行したい時には

Pocket
LINEで送る
このエントリーをはてなブックマークに追加

お問い合わせフォームなどで、チェックボックスを表示することがあります。

「Contact Form 7」で、チェックボックスを設置すると、改行せずに横並びになってしまいます。

 

ContactForm7chk

 

チェックボックスの項目ごとに、1行ずつで表示した方がわかりやすいです。

そんな時には、外観→テーマ編集を開いて、style.cssに以下の内容を追加します。

span.wpcf7-list-item {
display: block;
}

追加したら、「ファイルを更新」ボタンをクリックしてください。

 

ちなみに、テーマによっても編集内容が変わります。

例えば、ビズベクトルの場合ですと

#content form span.wpcf7-form-control-wrap .wpcf7-list-item,
#content form span.wpcf7-form-control-wrap .wpcf7-list-item label { float:none; }

上記を、style.cssに以下の内容を追加しますと

改行されます。

Follow me!

Pocket
LINEで送る
このエントリーをはてなブックマークに追加

【無料】はじめてワードプレスを使う人のための7ステップ