If you're like most beginner bloggers and even intermediate, then you definitely have no knowledge of HTML/CSS. Many bloggers (like me) prefer to use plugins that allow them to add buttons to their posts or pages using shortcodes. But these shortcodes - short codes - are difficult to remember and difficult to configure.

In this article, we will show you how to add buttons on WordPress without using shortcodes.

If you're new to the world of WordPress, discover How to Install a WordPress Blog in 7 Steps

The first thing you need to do is install and activate the Plugin « Forget About Shortcode Buttons ».

Once you have activated this Plugin, you will just need to create a new publication or modify an already existing one, and you will see a new button in the Visual editor with the title « Insert Button » (Add a button).

fasb-editorbutton

To insert a new button in your publication or page, you must click on the button Insert a button. This will bring up a window where you can design your new button.

designyourbutton

All you need to do is add button text and url, then select text and background colors. Then click on the drop-down menu of the option "Type", in order to choose the shape of your button. You can also choose the size of the button.

Complete your knowledge by discovering How to use and manage shortcodes WordPress

If you click on the tab « Icon », then you will be able to see the icons that you can add before or after the text of your buttons. All of this icons are more exactly icons-fonts.

buttonswithicons

During the button creation process, you will be able to have a real-time preview of each of your changes. Once you're happy with the look, just click Insert.

Check out this article and admire How to improve the design of your WordPress articles with these free shortcodes

You can also choose the alignment methods from the editor to align the button to the center, left or right. Double-click the button to bring up the button edit window, and you can edit the button if you want.

At this level, you now have the option of adding buttons to WordPress without using shortcodes. But before leaving you, we suggest you consult two WordPress plugins premium that will allow you to efficiently manage shortcodes.

1. WPBakery Page Builder

WPBakery Page Builder, formerly known as Visual Composer, is another premium and extremely popular page builder. Much of this popularity comes from the fact that WPBakery Page Builder comes with almost 99% of the WordPress themes by ThemeForest. But the fact remains that it is used on a very large number of websites.

wp bakery page builder e1544277016913
Like Divi Builder, WPBakery Page Builder allows you both visual editing and back-end editing. Compared to something like Elementor or Divi Builder, WPBakery Page Builder's styling options are a bit limited. You have good control over the lines, but the styling options for the individual elements are a bit more limited.

If you want to use your own CSS, you can add a custom CSS class or ID to individual elements, or you can add actual styles to the page level.

I'm not sure that WPBakery Page Builder has unique features that are particularly noteworthy. But what he has is a huge community of extensions. Like Divi Builder, WPBakery Page Builder leaves behind a multitude of shortcodes in your content if you disable it. Discover the tutorial

Download | Demo | Web hosting

2. Divi Builder

Divi Builder is a high quality page builder highly rated by Elegant Themes. Although usually used as part of the WordPress Divi theme, Divi Builder is also a standalone plugin that you can use on other WordPress themes.

divi e1544278044306

Unlike the previous two builders, Divi Builder allows you to edit your content using a visual interface on the front-end as well as an interface on the back-end, although most users prefer the first interface. .

Basically instead of the sidebars it's all in popups and floating buttons. It gives you access to 316 pre-designed templates spread across 40 different presentation packs, as well as the ability to save your own designs as templates.

One of Divi's traits has always been the control of the styles he gives you. On three different tabs, you can configure various settings, including responsive controls, customizable spacing, and more.

You can even add custom CSS, as its CSS editor includes basic validation and auto-completion. One of the criticisms of Divi Builder has always been that it relies on shortcodes. Which means if you ever turn it off, it will leave a bunch of shortcodes in your content. While this is a bit depressing, it is less of a problem now that plugins like Shortcode Cleaner exist. 

Download | Demo | Web hosting

Other recommended resources

Go further in mastering your WordPress website by also consulting these recommended resources.

Conclusion

Here ! We hope this article will help you add buttons to WordPress without using shortcodes. If you have any suggestions or remarks, they will be welcome.

We also invite you to consult our resources if you are a beginner blogger. But, nWe urge you to share this article on your different social networks.

...