How To Create Reusable Buttons in WordPress

If you have buttons in your blog or website and have found it difficult to keep track of where they are and what they are linking to, look no further.  In this post I will be showing you how to create reusable buttons in WordPress.  This post contains affiliate links which means if you click on one an purchase something I may receive a small commission which does not affect the price you pay.  Read more in my full disclosure policy.

Web Hosting

The MaxButtons WordPress plug-in allows you to create a button in one place, add a link to it, then you can use it wherever you want in your site.  If you want to modify the button or change the link you do it in one place and it changes it all over your site.

Here is my tutorial about

How To Create Reusable Buttons in WordPress

Find and Install the MaxButtons Plug-In

Find the plug-in in your plug-in library.

 

MaxButtons Plug In

After it is installed and activated you will find this menu item in your WordPress menu.

Max Buttons Menu Item

When clicked you will be navigated to the MaxButtons Button Creator. You can see in the image that the buttons I have already created are listed with a nice view of the button, description and shortcode.  Be sure to name the button something that helps you know what it is doing so you can save time by not having to click into edit to figure out what it’s doing.  I am still working on getting my naming down.

Create Your First Button

Now click the Add New Button.

MaxButtons- Button Creation

When Add New is clicked you will see the screen below.  Notice it has configurations and an image of the button in upper right side.

Add New Button

Configure Your Button, No Coding Required!

Let’s start configuring our button.  

First I name the button, but the name is not what appears on the button itself.  That is in the Text field. If you want to make the button wider, change the button width to a larger number.  You’ll notice the padding is only changed on the top. That is to keep the text centered in the button. The most important part is the URL.  What are you linking to with this button? For this button, I will link to an email capture page that will take the visitor to my video tutorial once they subscribe.

First Panel of Button Creation

Here is an example of the button with no padding.  See the difference?

Button with no padding

 

Below is the panel that displays when I scroll down.  This is where I actually change the button color to Red (BackGround Color).  I like my buttons to have the same color scheme so I stick with red and white throughout.

Second Panel of Button Creation

Now that my button is saved (don’t forget to click save – it’s way at the bottom), it’s time to add the button to my post.

Add Your New MaxButtons Button to Your Blog Post

Below is a draft of the post I am writing right now.  You can see the MaxButtons Add Button button at the top next to the Add Media button.

00013 - Add Buttons Icon in Post - circled

Move your cursor to the position where you want the button in your post and click the Add Button button.  A pop-up screen will display with all the buttons you’ve created. Just scroll if need be to button of your choice.  My button is right on top.

00013 - AddButton clicked display

Click on the button you want and then click Use this Button in the lower right corner of the pop-up.  

Another pop-up will display for you to verify the link is correct and the Text is how you want it.  When you are happy, click Insert Button into Editor (blue button on bottom right).

00013 - Chosen button confirmation

Clicking the More Options Link allows you to verify or modify other properties of the button (i.e. Open in New Window – which I always use) and the Button tooltip.

Once clicked the button shortcode will be inserted into your post.  You can now center it or whatever you’d like to do.

00013 - Button shortcode

Preview Your New Reusable Button

Let’s preview to see it.

00013 - Final Button Inserted Preview 2

The beauty here is you can reuse these buttons over and over and it’s not as critical if you don’t track where every button is because if you change the link or the color, it will be changed everywhere.  That is how to create reusable buttons in WordPress.

Watch the Video Tutorial

Watch my free video tutorial to see how it works.

Watch the Video!

 

 


2 Comments

Werner Gohr · November 10, 2018 at 9:40 am

You can definitely see your enthusiasm within the article you write.The arena hopes for even more passionate writers suchas you who aren’t afraid to mention how they believe.All the time follow your heart.

    Cheryl Texeira · November 10, 2018 at 9:52 am

    Thank you very much!

Leave a Reply

Your email address will not be published. Required fields are marked *

Shop Stock Images, only $3 each! Buy 3 or More and get 25% off. Use Coupon Code BUY3FOR25. Dismiss

%d bloggers like this: