ご注意!

この記事にはCSSコードが含まれており、開発者を対象としています。このコードは便宜上提供していますが、コードのカスタマイズやサードパーティの開発についてはサポートしていません。

追加のガイダンスについては、WPBeginnerのカスタムCSSの追加に関するチュートリアルをご覧ください。

閉じる

送信ボタンのBEテーマオーバーレイを修正する方法

概要

BEテーマを使用しており、送信ボタンにカーソルを合わせたときにオーバーレイが表示されることに気づきましたか?このオーバーレイは、テーマがすべてのボタンに追加するデフォルトのスタイルによるものですが、簡単なCSSスニペットを追加することで、フォームに対して簡単に修正できます。

css変更前のwpforms表示

セットアップ

このCSSをサイトにコピー&ペーストするだけです。サイトにCSSを追加する方法についてサポートが必要な場合は、こちらのチュートリアルをご覧ください

.wpforms-page-button:after, 
.wpforms-submit:after { 
    display: none !important; 
}

CSSを追加すると、WPFormsの送信ボタンに表示されていたオーバーレイは表示されなくなります。

このCSSを追加すると、カーソルを合わせたときの送信ボタンのオーバーレイは表示されなくなります

これで完了です!他のCSSチュートリアルを試してみませんか?フォームフィールドのフォーカスにCSSを追加する方法のチュートリアルをご覧ください。