Text links aren’t bad, but to really highlight what your readers should do after reading your article, you need to a Call to Action – that is, an element designed to help the reader take the next step (or action).
I decided I needed some here on Do It With WordPress and wanted to encompass it within a shortcode that I create myself, rather than use yet another plugin.
I looked around online for what I was looking for, and it was Chris Coyier from CSS Tricks that got me on the right track.
Create the shortcode
First of all, we’re going to create the shortcode, with several variables. Copy the following code into your functionality plugin, or functions.php if you don’t have one.
This creates a shortcode with three variables: a title, subtitle and the destination URL. That’s all there is to it for that part.
Style the button
Now we’re going to put some styling with the button to make it look really snazzy. I copied this styling directly from the original tutorial, but you can always tweak the colors to help it match your own site. Paste this code at the bottom of your style.css file.
Save that file and now we’re ready to put it into action.
Using the shortcode
When you’re editing your next post, you can insert a call-to-action button by using the shortcode, as shown below:
And when you actually use that code, it will look something like this:
Catches your attention right? That’s the point! Now you can take it and make it your own with your own color scheme.