How to Add Custom Shortcodes on Page Builder Sandwich

From the word itself, the word shortcode means exactly that: A short code; a shortcut code.

Shortcodes allow you to add things to your website (like widgets, for example), without having to add in huge chunks of code like developers normally would.

For example, a regular piece of code, in terms of length, would probably look something like this:

<html>Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Etiam id aliquam turpis. Vivamus quis arcu tincidunt, finibus urna eget, placerat risus.

Aliquam arcu massa, finibus et lacinia sed, scelerisque nec augue. Quisque eu viverra sapien, vel consequat lorem. Integer vel erat tortor.

Phasellus condimentum magna eget congue venenatis. Suspendisse blandit vehicula consectetur.

Nullam sodales eleifend massa, in bibendum purus fermentum id.

Morbi et turpis feugiat, malesuada ipsum sit amet, interdum nulla. In non ante nec nisl mattis gravida sit amet id lectus.


For this example, let’s pretend that the piece of code above will let you add an entire paragraph of Lorem Ipsum placeholder text.

Now, a shortcode with the same exact function as the code above will look something like this, in contrast:

[lorem ipsum dolor estat]Lorem Ipsum[/lorem]​

You can see how they’re miles different from each other in terms of length.

Now imagine that both pieces of code– The original, lengthy piece, versus the shortcode containing just the word “lorem”, would both do the exact same thing: Add Lorem Ipsum text.

This is what shortcodes do. They make adding widgets, functions, and a bunch of other cool stuff easier for both ordinary WordPress users and developers alike.

Where can I find shortcodes?

If you have a favorite plugin or widget, chances are, they have a shortcode available for you to use.

Shortcodes Ultimate, for example, will let you choose from hundreds of shortcodes that you can use on Page Builder Sandwich (or anywhere, actually) by simply grabbing the shortcode of your choice from Shortcode Ultimate’s repository or documentation page.

Adding Custom Shortcodes on PBS

On Page Builder Sandwich, you can add shortcodes directly onto your page by just typing or copy-pasting it onto your content area.

We did this below with a shortcode from Shortcodes Ultimate, adding a content box on the Page Builder Sandwich demo page:

Another thing you’ll find handy when using Page Builder Sandwich is our Shortcode Mapping feature.

From one of our previous articles on Shortcode Mapping, the definition is as follows:

Shortcode mapping is like letting Page Builder Sandwich memorize all the shortcodes available on your site: their names, descriptions, their attributes, and what each of these attributes do.

Part of this means that you no longer have to manually look for your shortcodes on their respective documentations or repositories.

As long as you have the plugin that includes the shortcode installed ont o your wordpress site, it’ll be easily available for you to use on Page Builder Sandwich.

So for example, if I wanted to add a WooCommerce shortcode on my page, all I have to do is make sure that it’s installed on my WordPress site, like so:

And then, to actually add the shortcode, I’ll just go to my page, and drag and drop the Shortcode Element:

Because we already have WooCommerce installed on our WordPress site, you can see that all of the shortcodes that are available on the WooCommerce plugin are already available on Page Builder Sandwich. This is what Shortcode Mapping is.

You can also see on the upper left corner that the ACF (Advanced Custom Fields) and MailChimp shortcodes are available– because we have those instlled on our WordPress site, too.

So if you want to add custom shortcodes, or shortcodes you’ve made on your own, you can, as long as you have them installed onto your WordPress site.

Here are some other helpful plugins that you can use to create your own custom shortcodes:

Leave a Reply

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