adding shortcode to elementor

How to add a plugin shortcode to an existing Elementor page

OK, so you got an awesome new plugin to add some extra cool functionality to your WordPress website, and now you have no idea how to get that plugin interface or data to show up in your Elementor webpage. All you have is what you’ve been told is a “plugin shortcode”.

Wh-ha-haaat?!?! How are you supposed to get this stuff to show up? You don’t know code! “Plugin shortcode” sure sounds like code to you!! Blaaaggghhhh!!!

Fear not.

Since you’re a non-coder, even the term “shortcode” might actually put you into a tailspin. However, shortcodes are not really code (well, not in the raw, traditional sense), they are just a teensy bit of language that calls a program to run in the background of your site. Shortcodes allow you to inject these extra programs into your webpage, without you actually having to write the code in there.

All you have to do, is call the program through the shortcode. Score!

And that’s as technical as I’m going to get there. But I wanted you to know what “adding a shortcode” meant, so you’re not completely in the dark as to what it is.

 

So how do you put a shortcode from a plugin into an Elementor page? What am I even talking about?

So you have this cool plugin now, which was not originally included in your current WordPress/Elementor site build. As an example, if you bought a website and training through me here, my Elementor templates are pretty… er… elementary, and don’t include any special plugins or functionality that you may need to make your website more robust.

As a result, maybe you searched around looking for a fancy email optin plugin, maybe an appointment booking or event management plugin, or maybe something that would pull in a social media feed. And it’s possible, that in order to get the data and/or the interface to show up on your webpage, you have to use a shortcode.

The shortcode will be provided by the plugin developer, so you’ll need to check the documentation from the plugin developer to find out what their shortcode language is. I cannot provide that for you.

[There are some plugins that have been already programmed to integrate with Elementor, and therefore after you install and activate it, a new widget for that plugin will show up in your Elementor side panel.

However, not all plugins are integrated with Elementor (yet, heh). At the same time, they will work with Elementor, in an Elementor-built page, if you follow these instructions (or they should, anyway. If you have any issues, you will need to take that up with the plugin provider).]

For the sake of this post, I will use the appointment booking plugin Amelia, to use as a demonstration. This plugin is one that I actually use, in order to book appointments for my trainings. Since the plugin is not currently integrated with Elementor, in order to get it into my Elementor-built page, I have to use a shortcode.

 

Let’s go!

 

1. Locate the section of your page in which you want the plugin data/functionality to appear.

In my case, I want an availability calendar to show up on this page, so people can find out when they can book appointments. I’ve created a headline for the calendar, and where the blue box with the is, is where the shortcode widget will go.

 

 

2. At the top of the Elementor side panel, type into the search box “shortcode”. The shortcode widget will show up.

 

adding shortcode to elementor

 

3. Drag and drop the shortcode widget into the location on your page that you want the plugin information to appear.

 

adding a shortcode

 

4. In the Elementor side panel, you will now see the shortcode widget setup. Enter in your plugin’s shortcode here. Then click “Apply”.

 

adding a shortcode

 

You’ll notice that the shortcode language will show up in the location you dragged the widget to, and where you want the data to show up on your page.

 

adding a shortcode

 

5. Click update to update your Elementor page. Then check your work in another browser!

 

adding a shortcode

 

 

adding a shortcode

 

Your plugin data/functionality (in this case, my calendar) should now show up in the web page. If you’ve followed these instructions exactly, and you are certain you have the shortcode from the plugin developer typed correctly (this is very important), you should have no trouble.

However, if the plugin is not showing up as expected, you can test out the shortcode itself in a tester page that was NOT built with Elementor, to make sure it works as you’ve entered it. In the unlikely event that shortcode is not working even there, you’ll need to recheck the entry and/or consult your plugin developer for help.

 

This is a new page, using the Classic WordPress editor. Just enter the shortcode in the text box as shown, publish/update, and view to see if it works.

 

adding a shortcode

 

If for some reason you have done everything as I have instructed here, and nothing is working, you will need to contact the plugin developer and/or Elementor. Sometimes there are inexplicable conflicts that just… are. It’s part of software life!

Following is a quick video detailing the same instructions I’ve outlined here.

 

 

Good luck!

Facebook
Twitter
LinkedIn
Pinterest
Email
Print

More to explore

Leave a Reply

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

So you need a website... now what?!?!?

Discover the five things to do first that will make your website-creation process ohhh so much smoother.

Start your website with confidence.

End the overwhelm.

Like this website?

You can make one like it! Using Elementor, you can make a stunning website just using point and click - no code required!

Everything you need for your website project!

Unlimited downloads of 53+ million creative assets - photos, stock videos, stock audio, graphic templates and more!

All for less than 50¢ a day

See for yourself

Want more cool widgets for your Elementor site?

Yep, I use them too.

Like this post and want to know when more come out?

Sign up below to receive free, fun weekly emails on how to get your business online without going crazy.

Need support? Tools? Resources? It’s all here, waiting for YOU!