What's WP
Our everything is about WordPress - best choice of WordPress users!
How to Create Custom Call to Action Button in WordPress

How to Create Custom Call to Action Button in WordPress

The tutorial is written for those who have the desire to learn how to create a custom call to action button in WordPress. As is known to you, CAT button is an important element of your WordPress site, which calls on your readers to take some actions, for example, to purchase your products. Therefore, it is worthy of your attention if you want to improve your conversion rate.

Since there is not a built-in system which allows you to create a custom CAT button, you need to look for a workaround to get the job done. Indeed, you can either edit your style.css file or take advantage of a plugin. A proper CAT button will help you grab the attention of your visitors and encourage them to take more actions. Thus we also try to give you some tips to create a proper button.

Create Custom Call to Action Button with CSS File

It is never a waste of time to create a child theme when you have to deal with the code. What you need to do is to add the code snippet into the style.css file. If you want to customize the color, size, text, and many more, you can change the code to meet your requirements.

Add CSS Code

At this moment, you can place the button in a place where you want it display on your WordPress site. Just add the below HTML code into your text editor. Certainly, you have a full freedom to decide the URL and button text.

Add HTML Code

Create Custom Call to Action Button with a Plugin

To be honest, you are more advised to use a plugin because it will not threaten to the the security of your WordPress site under normal circumstances. After our test, WP Button Creator Plugin leaves us a deep impression because Photoshop and coding skills are not needed in order to create good-looking CAT buttons.

On the Plugins > Add New page, it is necessary for you to upload the plugin file into your WordPress site. After a click on the “Install Now” and “Activate Plugin”, you will notice a new table “WP Buttons” on the dashboard.

Upload Plugin

Then you need to land on the WP Buttons > Add Buttons page where you are free to decide the sections including Basics, Button Content, Button Text Styles, Button Border Styles, Button Colors, and Button Container. For example, you need to enter the button text and target URL on the Button Content section. In addition, you are advised to check the Open New Window box for a better using experience. On the right side of your screen, you can preview the button along with your changes.

Configure Plugin

When you save the changes, you should navigate to the WP Buttons page where the plugin generates a shortcode for your button. At present, you are able to decide the placement by adding the shortcode like [wpbuttons ids=”2_1″] into your post or page.

Generated Shortcode

Wrap up

A suggestion is that you need to customize the design of the CAT button on the basis of some principles. Firstly, button should stand out so that you will have readers’ attention. Secondly, button actions should be as clear as possible. Thirdly, button design should be in accordance with your webpage.

Author

Susan Rose is a freelance writer who has a deep knowledge about WordPress. She loves everything related to website building since the freshman year at Christopher Newport University, and loves to share her experience with people all over all the world. This girl is popular among our readers as she is outgoing and energetic. In the daily life, Susan loves detective novels as it can train her logical thinking and creativity.

Close

Want to Learn More About WordPress?

Get Our Free Themes, Plugins, Support, SEO Tips, and Other Tutorials!


Fatal error: Call to undefined function es_subbox() in /home/whatswp/public_html/wp-content/themes/mantra/footer.php on line 140