Forminator is an excellent WordPress forms plugin. Follow these steps to remove the default shadow hover effect on a forms submit button.
- Login to your WordPress site admin.
- Go to Forminator Pro > Forms
- Click to edit a form.
- Click the Appearance link (top-left).
- Scroll down and click the Enable Custom CSS toggle button.
- Paste the CSS code (see below) into the custom CSS field.
- Click the Update button (top-right) to save your edits.
- Click the Preview button (top-right) to preview the form.
The CSS Code:
button.forminator-button.forminator-button-submit {
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
box-shadow: none !important;
}
Code for Forms That Use Page Breaks
Forminator has a “Page Break” module that can be inserted into a form to break form content into seperate “page” steps. Use the code below to remove the shadow on “Back” and “next” buttons that appear on form break screens.
The CSS Code:
button.forminator-button.forminator-button-submit, button.forminator-button.forminator-button-next, button.forminator-button.forminator-button-back {
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
box-shadow: none !important;
}
Enjoy!
Thanks for this. I have been looking for a way to remove the button shadow before I found your blog. Thanks once again
My pleasure Segun!
Thanks for this! It still works in 2024!
You’re welcome Chrisina. I started “The Web Guy Newsletter.” Check it out at https://thewebguy.me or follow me on LinkedIn at https://linkedin.com/in/edphelps