Theme Shortcodes

As already explained, the theme uses a slightly modified version of the popular Visual Composer plugin, with some default shortcodes and custom build ones as well.

Note 1: Not all of the original VC shortcodes are available in this theme, but everything what you see in the online demo can be achieved with shortcodes.

Note 2: The front end editor of Visual Composer doesn’t work with this theme.

Below you’ll find a list of all available shortcodes:

1. Row

A simple row, the holder of multiple columns, which are actually the “modules” in this theme and the base of everything.

2. Text Block

This is the most basic shortcode of them all. Whenever you need some text or add a custom shortcode (not available in here), or an iframe, or anything which uses text / HTML, use this shortcode.

3. Separator

This is a simple blank separator. You can choose both a top or a bottom margin so please experiment with this to see what works when. Not everything works all the time, so that’s why there are two options. You can also put a border on the divider.

4. Section Titles

Adds a custom title (bigger and better for large sections).

5. Message Box

A simple text box with four style options.

6. Single Image

If you’re looking to add an image as a module inside a column, please use this shortcode. It features smart resizing and it’s the perfect way to add images to the theme. 

7. Tabs

This is a simple tabs shortcode.

8. Content Slider

A simple content slider in which you can put anything you want.

9. Widgetised Sidebar

If you have some awesome WordPress widgets that can’t be embedded in any place other than a sidebar, you can use this shortcode to choose a custom sidebar (which you create in the Theme Options).

10. Button

This is a simple button, with different styling options.

11. Raw HTML

If you want to add raw html code to the site this is the way to do it (although you can add simple stuff like iframes and tables into the text blocks).

12. Raw JS

I can’t think why would you need javascript added in the body of the site, because of such purposes you should use plugins, hooks and external files, but if you want to go wild with this shortcode, here you go.

13. Flickr Widget

As the title suggests, it is a basic feed from a user’s latest flickr stream.

14. Icon Text Block

This is a regular text block which provides an icon available in various styles. The list of icons is the one available here: http://fontawesome.io/icons/

15. Contact Form

A simple Contact Form with various options. If you want a more complex contact form you should use a popular plugin, such as Contact Form 7.

16. Team Member

A simple team member, which can be used in any other way (it’s basically a text block with an image at the top). The content should be used to insert the social shortcode.

17. Revolution Slider

Insert a Revolution Slider, which can also be done in the Text Box, via the shortcodes provided by the plugin.

18. WordPress Widgets

There are 13 default WordPress widgets which can normally be used only in widget areas, but with the Visual Composer you can use them anywhere you want.

But more than this, you also have some shortcodes which are not available in the composer, but can be added easily as regular shortcodes via a Text Block or the classic editor.

All these shortcodes have the ability to select a custom class. This class can be useful for extra editing (there are already some classes available, but you can create custom CSS code and apply it to certain shortcodes by using the custom class field).

OTHER SHORTCODES (non-VC)


19. Gallery

The gallery shortcode is a basic WordPress shortcode which in this theme translates into a slideshow or a grid. You can add a gallery by hitting the “Add Media button” and following the instructions there. The columns do work with this theme, so you can style the gallery exactly like you want.

Another cool feature of this theme is that you can turn a WP gallery into a shortcode, so you can easily insert sliders absolutely everywhere you want! To change a grid gallery into a slider, go to the “Classic Editor” and you’ll see the gallery shortcode like this (just an example):

[gallery ids="1,2,3"]

You need to simply add type=”slider” as a parameter, like this:

[gallery ids="1,2,3" type="slider"]

If you want to add captions either to the galleries or sliders, simply caption the images that you want to have a caption in the WordPress gallery creator. All images with a caption added in the backend will feature a caption on the site.

20. Self Hosted Video & Audio

While embedded videos (or maps) can be added via iframes (all these sites such as YouTube, Vimeo, Google Maps, offer embedding options via iframes, so there’s no need for custom built shortcodes). So while embedded videos have their own method, you can also add custom videos using the WordPress video shortcode. More info here: https://codex.wordpress.org/Video_Shortcodehttps://codex.wordpress.org/Audio_Shortcode

21. Social Icons

The social icons are an easy shortcode which can be added manually like the shortcodes above.

[vc_social_links twitter="http://twitter.com/yourprofile/" facebook="http://facebook.com/yourprofile/" target="_blank"]

Each new attribute represents an url, and these are the possible values: behance, bitbucket, codepen, delicious, deviantart, digg, dribbble, dropbox, facebook, flickr, foursquare, github, googleplus, instagram, lastfm, pinterest, reddit, skype, soundcloud, steam, spotify, stumbleupon, tumblr, twitter, vimeo, vine, vk, xing, yahoo, youtube, rss, email. All these social icons are available for use in this theme.

Don’t forget the target property which can be either _blank (opens links in new windows) or _self (opens links in the same window, default).

22. Lightboxes

To create a ligthbox gallery use WordPress galleries and configure the gallery exactly like you wish. To create a lightbox image, simply put an image linked to the large version and it will transform into a lightbox.

To create an iframe which loads an iframe or use a button to open an image into a lightbox, use these codes:

A. Iframe wrapped in a thumbnail:

<a href="//player.vimeo.com/video/90480436?title=0&byline=0&portrait=0&color=e5493a" data-fancybox-type="iframe"><img alt="" src="http://yourwebsite.com/path_to_thumbnail_img.jpg" /></a>

B. Iframe wrapped in a button:

<a href="//player.vimeo.com/video/90480436?title=0&byline=0&portrait=0&color=e5493a" data-fancybox-type="iframe">Your Label</a>

C. Iframe wrapped in a text link:

<a data-fancybox-type="iframe" href="//player.vimeo.com/video/90444206?title=0&byline=0&portrait=0&color=e5493a">Your Text</a>

D. Image wrapped in a button:

<a  href="http://yourwebsite.com/path_to_thumbnail_img.jpg">Your Text</a>

E. Image wrapped in a text link

<a  href="http://yourwebsite.com/path_to_thumbnail_img.jpg">Your Text</a>

Using this method above you can use the ligthbox exactly as you wish. These are the available options.

Make sure than when embedding content from video sites and such, you only take the href or src from the embedding code. Don’t put everything in there!

23. Video / audio playlists

Just as you add a video or an audio file to any page, you can now add full media playlists as content. When inserting media, along with the old gallery button you can now see two other buttons, which will guide you through an easy way to add the playlists on your pages.