CSS Hero is really cool
It's been a really busy week, but I'm very excited to bring you a video that demonstrates how to style the Beaver Builder theme without typing a single line of code.
I used a really cool plugin called CSS Hero which enables you change the style of any theme element by moving sliders and using a color picker. Absolutely no code required!
The video is a bit longer than I planned - because I got bit carried away and created a whole page - but all the good stuff on CSS Hero is at the beginning.
If you're already a Beaver Builder expert, the second part of the video shows you how to create a page with Beaver Builder, so there's no need to stick around.
Here is a before and after on the header:
Header - Before CSS Hero
Header - After Using CSS Hero
As mentioned earlier, the new header was created without typing a single line of code. I used the Beaver Builder theme settings to select the logo and the menu position.
I added the background photo, changed all the menu colors (normal, hover & active) as well as the menu text size, using CSS Hero. The Social icons and phone number colors and size were also easily changed with CSS Hero.
There is a heck of a lot more you can do with CSS Hero - For example you can change heading fonts, sizes and colors, or change the footer text color, size etc. Once you've played with it for half an hour, it's becomes very easy to target and modify anything you want.
CSS Hero is available as a single site license for $29 or a 5 site license for $59. If you're a developer you can get a 999 site license for the special price of $99 right now. that's a fantastic deal considering all the flexibility you get!
Get CSS Hero
I'll be doing a few more videos on CSS Hero soon. These will include another one showing all the options you can change in the Beaver Builder theme. I also plan on doing one for the Genesis framework. Last, but not least, I'll be recording one on how to style Contact Form 7 forms and Gravity Form with CSS Hero. That one will be really cool!
Win a copy of CSS Hero
I have one license of CSS Hero to give away. The first person to leave a comment on this post will get a free copy of CSS Hero from me:)
Thanks for stopping by. I hope you found this post and video useful.
Until next time,
As you can see in the comment section, David was the winner of the free copy of CSS Hero. I hope you're having fun with it David:)
CSS Hero Discount Code
For those of you who weren't lucky enough to win the free copy of CSS Hero, I have some good news for you. The CSS Hero team have given me a Discount Code that you can use to buy CSS Hero at a lower price.
Just click on one of the following links and enter HEROBEAVER in Coupon box to get the discounted price: