Which would you rather click, the plain link or the button?
They both take you to the same place, but the button looks nicer and more clickable. Replacing plain links with buttons can generate more clicks and make your page look better.
In this post, you’ll learn how to add buttons with any color and style imaginable to any post or page on your WordPress site.
Update: try Elementor
There’s another great way to add buttons to WordPress!
The free Elementor plugin is a complete drag-and-drop page building solution, but it can also handle simple tasks like adding buttons to your posts easily.
Edit with Elementor
With the Elementor plugin installed, you’ll find a new Edit with Elementor button added to all your posts and pages.
Click this button and you’ll be taken to the Elementor editor which is a lot like the native Customizer found in WordPress.
In the left side is the control panel where you can find all the elements available. The button element is readily available in the Basic elements section.
Click-and-drag the button element anywhere into the post and you’ll see it automatically added to your post. Once added, you’ll see the left panel update with the settings to modify the button.
As you can see, it’s easy to edit the button text and URL, as well as some other options like the text alignment and the option to add an icon.
There are a ton more options available in the Style and Advanced tabs of the settings panel.
As you can see, you can create any kind of button you can imagine using Elementor.
This plugin may be a bit overkill to simply include a button in one post, but I think you might be excited about all the other possibilities that come with this plugin.
If you’re interested in learning more about how to use Elementor on your site, take a look at our complete Elementor page building guide.
Add buttons within the post content
Since Elementor is a page builder and has its own element system, you’ll notice right away that you can’t add buttons within the post content – only before or after.
The simple workaround is to copy and paste part of the post into a Text Editor element, and then you can include any Elementor elements before/after it such as a button.
Now here’s the original method recommended in this post for adding buttons to your posts and pages.
How to use Shortcodes Ultimate
The easiest way to add stylish buttons to your posts and pages is with the Shortcodes Ultimate plugin.
This plugin is amazing.
You’ll find tons of other uses for Shortcodes Ultimate, but most importantly, it makes button creation effortless. Here’s a screenshot from the plugin with some examples of the various button styles.
You can mix-and-match colors, sizes, background styles – any property a button can have.
Not sure how to use shortcodes? Take a look at this tutorial on shortcodes.
You’re probably itching to get started now, so here’s the step-by-step on how you can use this button plugin on your site.
Install & activate
Search for “Shortcodes Ultimate” in your Plugins menu and install it like any other WordPress plugin.
Activating the plugin will add a new top-level menu to your dashboard.
Use the insert shortcode button
Shortcodes Ultimate also adds a new Insert shortcode button to the editor.
Clicking this button will reveal the huge array of content types available in Shortcodes Ultimate including the button option we need.
Once you select the button shortcode, you’ll be taken straight to the button configuration screen.
Shortcodes Ultimate also has premium add-ons that add even more shortcode types and styles.
Configure the button
There’s an enormous amount of settings you can use to customize every button you make including:
- Background color
- Button text
- Text color
- Button link
I took a screenshot of the entire style section, but it’s too massive to include in the post. You can click here to view the full style settings page.
Review and insert the button
As you change the style, you can use the Live Preview button at the bottom to get a quick look at how your button will look.
When you’re finished, you can save your button as a preset so that you can reuse the same styling again elsewhere on your site.
Lastly, press the Insert shortcode button, and a shortcode will be added for the button.
While you’ll only see a shortcode in the editor, it will be rendered as a button exactly the same as you previewed when you visit the post.
Adding buttons to WordPress
You don’t need to be a CSS master to start adding attractive buttons to your WordPress website.
Shortcodes Ultimate makes button creation simple and incredibly flexible. And you’ll probably find a dozen other uses for it once you’ve installed it on your site.
Have any questions about adding buttons to your posts and pages? Leave a comment below.