How To Add Button On GeneratePress (Without A Shortcode Plugin)

Want to add a button on your GeneratePress theme? But don’t want to install a separate shortcode plugin, then I can help you to place awesome HTML buttons to increase your affiliate conversion.

Just scroll down a little and you will find that I have used a button to navigate to GeneratePress website, offering a special discount. I have created that button using a few CSS codes only. I have not installed any additional plugin for that.

If you are still thinking to migrate to GeneratePress theme, then I would say this is the best time to get GeneratePress Coupon with 25% OFF special discount. You have to pay only $37.46 to have this awesome theme.

Save 25% on GeneratePress [Limited Period OFFER]

Why You Must Use Buttons on Your Blog Post?

GeneratePress is one of the most popular WordPress themes for bloggers. And there are plenty of reasons why GeneratePress is the best WordPress theme for a fast loading website. But due to its simplicity, this theme doesn’t have many necessary features with the default template like adding a button or related post.

I am sharing here how you can add a button on your GeneratePress theme, without installing an additional WordPress plugin.

Note: I am not using Gutenberg editor (disabled Gutenberg), as I am still using the classic editor. If you are using Gutenberg editor, then you can create buttons easily as there are options.

CTA or call to action is a must on your blog post to engage your audience. You can add various types of CTAs to capture email, navigate to a blog post or even transfer your visitors to a landing page.

As per my experience, BUTTONs work great for affiliate articles. Recently I have started adding buttons on necessary places to provide a call to action. But like you, I don’t want to install another plugin.

Also Read What plugins do I need for WordPress?

Steps To Add Buttons on GeneratePress Themes [No Shortcodes Plugin]

There are many shortcodes plugin available with which you can create some awesome looking buttons. But as I said, I want to have a low number of plugins. If you have checked my Rank Math SEO Plugin review article, you will realize how happy I was after installing that plugin. I was able to get rid of 5 plugins.

Anyway, here are few simple steps to add simple but effective buttons on your blog with GeneratePress theme.

Step #1: First of all if you are using a GeneratePress child theme, just check whether it has added any additional CSS on the theme for BUTTON. By default, GeneratePress has a class named .button created already. I am using the MARKETER child theme from GeneratePress site library. There are many such ready to use templates.

You can find the CSS code for the button is added already. If not, you can copy the code below and add in the below area.

add button generatepress

Login To Dashboard => Appearance => Customize => Additional CSS =>

Put below code after all the existing code.

.button.light {
background: #fff;
color: #000;

.button.light:hover {
background: #fafafa;
color: #222;

Step #2: The next step is to use the class on your blog post to create the button. To do that, you have to navigate to the TEXT part of your WordPress editor. For the above button, I have added the below code. You can use the same code and do necessary changes and paste in your blog post.

<a class=”button light” href=”” target=”_blank” rel=”noopener noreferrer”>Save 25% on GeneratePress [Limited Period OFFER]</a>

Step #3: This is just a simple code to add a button. If you know how to play with CSS code then you can create a more attractive button like ghost button, gradient button, etc. Just check this link to explore more CSS options.

Top Shortcodes Plugins For WordPress

Well, if you don’t like to use these shortcodes or don’t find this tutorial useful, you can use shortcode plugins. There are many such plugins with which not only you can add buttons but many more design elements while creating a blog post. In case you love to design using a page builder, try Thrive Architect plugin.

Free shortcode plugins for WordPress

  • Shortcodes Ultimate
  • WordPress Shortcodes
  • Fruitful Shortcodes
  • WP Shortcode by MyThemeShop

There are a few paid plugins as well. But I would say it is better to use CSS code to add a simple button to your GeneratePress theme. In case your requirement is just only to add a button. If you want to add more design elements then you can try a shortcode plugin.

Don’t Miss How do I create an affiliate link in WordPress with Thirsty Affiliate

If you find this short tutorial useful, then share this article on your social media platforms. Keep a track of this website for more such useful WordPress tutorials. I help people to build a better blog & be a better blogger.

Save 25% on GeneratePress [Limited Period OFFER]

how to add button generatepress
__CONFIG_local_colors__{"colors":{"635a9":"Accent Color","cd03b":"Border"},"gradients":{}}__CONFIG_local_colors__

Disclosure: This post may contain affiliate links, meaning that if you click on one of the links and purchase an item, we may receive a commission (at no additional cost to you). All opinions are our own and we do not accept payments for positive reviews.

Read More Articles...

Leave a Reply

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

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
Share via
Copy link