Tutsflow

How to add a Shortcode in Your WordPress Website

A shortcode is an important tool for anybody who interested in modifying the way their WordPress website works since shortcodes offer the latest customization without forcing you to know much about coding in general.

Shortcodes in WordPress website are small bits of code that allow you to do different things with little effort. This allows you to execute code inside WordPress website posts, pages, and widgets without writing any code directly. For example, a shortcode for insert a video might look like this:

[shortcodes-video]

Shortcodes are best for creating things like buttons, Twitter widgets, Dividers, Accordion style sliders, Social share and all sorts of formatting goodies that would typically force you to understand PHP coding. In short, shortcodes make all the things easier.

Start With the Built-In WordPress Shortcodes

WordPress does offer some of the shortcodes by default (for example the gallery one) and plugins can add their own as well via the Shortcode API.

Check out the below links to learn more somethings about the default WordPress shortcodes:

How to Create a WordPress Shortcode

Let’s start to make a shortcode that gives an Adsense module by only typing [adsense] into the editor.

Step 1: Place the Function into functions.php

First search the functions.php file for your WordPress website and paste the following function in that file. We are using the Adsense function as a simple example. A function is primarily the composition that tells the shortcode what to reveal on the frontend of your website. In this case, when we place the [adsense] shortcode in the website, it uses the following function to show an ad.

function google_adsense() {
return '<script type="text/javascript"><!--
google_ad_client = "<em>your client id</em>";
google_ad_slot = "<em>your ad slot id</em>";
google_ad_width = <em>width</em>;
google_ad_height = <em>height</em>;
//-->
</script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
';
}

This code that you just insert into your functions.php file is what replaces the shortcode on the frontend–in this case a simple Adsense module. Depending on your function and shortcode you can add columns, custom buttons, social media widgets, and more.

Step 2: Combine Your Shortcode to the Function

Only you created the shortcode and function don’t mean the two are connected each other. Now we need to add a final call to pair the two. Use the call below:

add_shortcode('adsense', 'google_adsense');

The first term is what you would like to call your shortcode. So, since we outlined it as “adsense,” WordPress automatically creates an [adsense] shortcode. We called the function google_adsense therefore the second parameter inside our call instructs WordPress that it requires using that one function once you place the correct shortcode on your website.  Keep in mind that this is merely one of many shortcodes you can create on WordPress. If you’re thinking about making more, go directly to the WordPress shortcode API.

This is just one of many shortcodes you can create on WordPress. If you’re thinking about making more, go directly to the WordPress shortcode API.

Step 3: Making the Shortcode Work on Your WordPress Site

To test generated shortcodes on the original of your website you have to open a page or post in WordPress and place the [adsense] shortcode in the text. Now check preview or publish a page to make it permanent. That’s it! now you are very well to use shortcodes methods.

Using WordPress Shortcode Plugins to easy the Process

1. Shortcoder

Shortcoder is a plugin which allows to create a custom shortcode and store HTML, Javascript and other snippets in it. So if that shortcode is used in any post or pages, then the code stored in the shortcode get exceuted in that place.

2. Shortcodes Ultimate

This WordPress plugin that provides mega pack of shortcodes. This is really premium plugin that you can get absolutely for free!

Using  this plugin you can easily create tabs, buttons, boxes, different sliders, responsive videos and much, much more. Turn your free theme to premium in just a few clicks. Using Shortcodes Ultimate you can quickly and easily retrieve premium themes features and display it on your site.

3. Easy Bootstrap Shortcode

This WordPress plugin is bootstrap 3.2.0 compatible plugin which add icons to WordPress editor (tinyMCE Shortcode Buttons) and one can add bootstrap style to their website just by clicking on tinyMCE editor icon.

Many WordPress shortcodes plugin bunches of prepackaged shortcodes it assists in developing your own custom shortcodes. we have not explain all the plugins here, you can find via serach engine.

Go ahed and share your thoughts in the below comments, if you have any questions about WordPress shortcode options and how to use them on your site. Let us know. Thank you!

Share the Post:

Featured WordPress Plugins

PatternsWP

WordPress Block Patterns Library

Deals & Coupons

Unbounce Coupon

Save 20% off first 3 months

Cloudways Coupon

Save 20% off first 1 months