If you want to have a Call to Action style like the online Demo, this tutorial will show you how, including adding the animated button.
The code you will need is this:
<p>Clean simple design to give more emphasis on your website's content.<br><a class="btn btn-lg aqua animated fadeInDown" href="https://your-link-here.com/">Download Now</a></p>
- Go to Appearance >> Widgets
- Drag a text widget into the “Call to Action” sidebar position
- Title it to what you want. This will be the first line like the demo “Meet a Free WordPress Theme called Emphasize Pro!“
- In the content area, copy the above “code” and paste it into the widget. Make your changes to the content and the button link.
- Save your widget.
Styling the Button
With this theme, you get the following button sizes and styles…Make sure you start with btn as the first class to make it a button. Your sizes will be the classes you see in brackets below and in red.
- Extra Small (btn btn-sm)
- Small (btn btn-sm)
- Default (btn)
- Large Button (btn btn-lg)
- Grey – this is the default colour, so no class required.
- Yellow (yellow)
- Brown (brown)
- Orange (orange)
- Aqua (aqua)
- Dark Aqua (darkaqua)
- Black (black)
How to Apply Button Styling
To style your button, you are basically adding classes to the actual link
<a href> code like this example for the extra large button that is aqua in the demo:
<a class="btn btn-lg aqua" href="your link here">Button</a>
With the demo above, the button has extra CSS classes to add animation. In this case, it’s this:
Add this to the other classes to your link (button) code:
<a class="btn btn-lg aqua animated fadeInDown" href="your link here">Button</a>