Up next in 10
How to Change the Submit Button Color of The WPForms WordPress Plugin_
4K views
Oct 28, 2023
In this tutorial video, you'll learn how to customize and change the color of the submit button in the WPForms WordPress plugin. Discover a simple and effective method to match your form's design to your website's aesthetics or branding. Whether you're a WordPress user or a web developer, this video provides essential guidance on how to make your forms visually appealing and seamlessly integrate them with the overall look and feel of your website using WPForms.
View Video Transcript
0:00
What's up guys
0:02
Here's Cloudy from VisualMoto WordPress themes and today is really going to learn how to
0:05
change the submit color from our WP forms contact form, BOROM. So we're going to learn how to change the background color, the borders, the text color
0:16
This button right here, this form was built using the WP forms, the free WordPress plugin, okay
0:22
So no need to pay absolutely anything. Whoever the plugins does not give by the full the option to change this Boodon color
0:29
or Boulon size or any other parts. And this video, we're going to teach you how to do this
0:35
But before I can continue, please. Take a moment to hit the subscribe button, like this video, share this content with a friend
0:40
of yours. You have no idea how much it helps us because you bring daily videos about WordPress, SEO, plugins, optimizations, and many, many more topics in order to use Internet
0:47
on our sites favor. So let's get this started. But before, if you do not know about WP forms, you don't know how to apply this form
0:57
how to create a form like this one, go. to the visual model YouTube channel or just go to YouTube search and type WP forms
1:05
visual mode we have a couple of videos explaining from the plugin installation process to the form addition into your page okay simple easy and effective and of course I gonna leave
1:16
the link into the description below and the card over here so let's get this
1:20
started starting at the point that you already have a form and you just want to
1:24
change the submit button color this button right here all you have to do is go
1:30
to our WordPress dashboard Go to appearance and go to customize. If you are using a team that does not offer the customized button, into the browser tab, type
1:44
your domain.com, WP 80Mim customize. . If you type this into the URL, you're going to load a page almost like this one
1:54
Let me click into the contact page. So you can see the button
1:58
As you can see, the button have a light gray color. screw the left side bar of menus down until you see an option called it additional CSS
2:07
If you are using a visual model team like Anzhu Free WordPress team, you're going to have
2:12
a lot of menus right here to customize your site. But according to the team you have using you are using you may see only a couple of but additional CSS is present in all of the team so click on it and into the additional CSS let me
2:27
type some enter and enter this code right here pause the video let me apply
2:32
some zoom in I'm gonna try to place this code into the video description but you
2:37
can pause the video and copy this content okay dot WP forms form
2:43
form button type submit so background color import border color important color transition and WP forms over background color so what
2:56
does this code did as you can see the Bura did change the color this is a CSS
3:03
to change the BORON color from WP forms plugin in the case that I want to change
3:09
the background color we can change like this using the X decimal code style okay
3:14
so for example 1 8 818. That is a darker color. For example if you want to get more colors using this code style you can type X on Google and search and pick your color up So after change made make sure you click into this publish button clear your site cache and the button color
3:38
it's already changed it okay and that is I hope you guys enjoyed this video feel free to use the comments section below in the case that I have any
3:45
question don't forget to check out our borders WordPress plugin in our giging widgets elements templates and tools to build up your site using
3:51
Elementor or Gutenberg it's absolutely free and in the case that you are in
3:55
needs of an amazing free WordPress team go to our work WordPress dashboard, appearance, themes, add new, search for and zoo, WordPress team, click
4:03
on install and activated. Moreover, and as a final notice, in the case that I want your site up and running faster
4:09
go to visual model.com, purchase the VisualMoto Pass, and unlock access to our full templates
4:15
library that is almost like pre-built website that you can import with a single click and make
4:20
it yours from the beginning. In addition, you can count on our full support, premium icons, premium blocks, templates, widgets
4:27
and many, many more topics, okay? And there is. I hope you guys enjoyed this video, and I see you tomorrow
4:32
All the best