Shortcodes

[full-post]
Drop Caps
Add this code below when create new post. and you must be on HTML mode

Your First Character here
Bullet and List
To create a Bullet simply select all text you want to be a Bullet and click on Bullet List icon from blog post text editor panel.

To create a Checked List simply select all text you want to be a Checked List and click on Numbred List icon from blog post text editor panel

Blockquote
To create a Blockquote simply select all text you want to be a Quote and click on Quote icon from blog post text editor panel.

Buttons
Add the button you want by size and color.

/*----Small Buttons-----*/
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text

/*----Medium Buttons-----*/
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text

/*----Large Buttons-----*/
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Note Make sure you are in HTML mode when create new post

Alert Boxs
/*----success message----*/

success message : You successfully read this important message.

/*----Alert message-----*/

Alert message : This alert needs your attention.

/*----Warning message-----*/

Warning message : Warning! Best check yo self.

/*----Error message-----*/

Error message : Oh snap! Change a few things up.
Note Make sure you are in HTML mode when create new post

Or you can use this Short code:

/*----Alert message-----*/
[alert title="Alert message" icon="info-circle"]
This alert needs your attention
[/alert]

/*----Success message-----*/
[success title="Success message" icon="check-circle"]
You successfully read this important message.
[/success]

/*----Warning message-----*/
[warning title="Warning message" icon="exclamation-triangle"]
Warning! Best check yo self.
[/warning]

/*----Update message-----*/
[update title="Update message" icon="info-circle"]
You successfully to update your content.
[/update]

/*----Info message-----*/
[info title="Info message" icon="info-circle"]
This a simple info for you.
[/info]

/*----Error message-----*/
[error title="Error message" icon="exclamation-circle"]
Oh snap! Change a few things up
[/error]Note: You can see Icon name from fontawesome.
Code Boxs
[code type="HTML"]Yours HTML Code Here[/code]

[code type="CSS"]You CSS Code Here[/code]

[code type="JavaScript"]You JavaScript Code Here[/code]

[code type="JQuery"]You JQuery Code Here[/code]
Contact Form
[contact/]
/*----or-----*/
[contact][/contact]
Two Columuns
[2column]
[content]Your Text Here[/content]
[content]Your Text Here[/content]
[/2column]
Three Columuns
[3column]
[content]Your Text Here[/content]
[content]Your Text Here[/content]
[content]Your Text Here[/content]
[/3column]
Fours Columuns
[4column]
[content]Your Text Here[/content]
[content]Your Text Here[/content]
[content]Your Text Here[/content]
[content]Your Text Here[/content]
[/4column]
Tabs Horizontal
[tab]
[content title="Your Title Here"]Your Text Here[/content]
[content title="Your Title Here"]Your Text Here[/content]
[content title="Your Title Here"]Your Text Here[/content]
[/tab]
If you want to add some icon you can add icon property like this

[tab]
[content icon="facebook" title="Your Title Here"]Your Text Here[/content]
[content icon="pinterest" title="Your Title Here"]Your Text Here[/content]
[content icon="twitter" title="Your Title Here"]Your Text Here[/content]
[/tab]
Note Yo can get icon name here fontawesome

Tabs Vertical
[vtab]
[content title="Your Title Here"]Your Text Here[/content]
[content title="Your Title Here"]Your Text Here[/content]
[content title="Your Title Here"]Your Text Here[/content]
[/vtab]
If you want to add some icon you can add icon property like this

[vtab]
[content icon="facebook" title="Your Title Here"]Your Text Here[/content]
[content icon="pinterest" title="Your Title Here"]Your Text Here[/content]
[content icon="twitter" title="Your Title Here"]Your Text Here[/content]
[/vtab]
Note Yo can get icon name here fontawesome

Accordion
To create a accordion just create code like below.

[accordion]
[item title="Accordion 1"]Your Text Here[/item]
[item title="Accordion 2"]Your Text Here[/item]
[item title="Accordion 3"]Your Text Here[/item]
[item title="Accordion 4"]Your Text Here[/item]
[/accordion]
If you want to add some icon you can add icon property like this

[accordion]
[item icon="facebook" title="Accordion 1"]Your Text Here[/item]
[item icon="twitter" title="Accordion 2"]Your Text Here[/item]
[item icon="pinterest" title="Accordion 3"]Your Text Here[/item]
[item icon="diamond" title="Accordion 4"]Your Text Here[/item]
[/accordion]
Note Yo can get icon name here fontawesome

Image
to create image u can use this shortcode method

[img src="Image_URL_1"/]
/*------- or -------*/
[img src="Image_URL_1"][/img]

/*------- complete code ------*/
[img url="URL_link" width="Image_width" height="Image_height" rel="Image_rel" src="Image_URL_1"/]
Gallery Image
IMAGE_TITLE
IMAGE_TITLE
IMAGE_TITLE
IMAGE_TITLE
IMAGE_TITLE
IMAGE_TITLE
Or if you want image with some link you can create like this

IMAGE_TITLE
IMAGE_TITLE
IMAGE_TITLE
IMAGE_TITLE
IMAGE_TITLE
IMAGE_TITLE
Note Make sure you are in HTML mode when create new post

Or you can use this Short code:

[gallery]
[img src="Image_URL_1"][/img]
[img src="Image_URL_2"][/img]
[img src="Image_URL_3"][/img]
[img src="Image_URL_4"][/img]
[img src="Image_URL_5"][/img]
[img src="Image_URL_6"][/img]
[/gallery]
First Big Gallery
To create First Big Gallery just create code like below..

[bgallery]
[img src="Image_URL_1"][/img]
[img src="Image_URL_2"][/img]
[img src="Image_URL_3"][/img]
[img src="Image_URL_4"][/img]
[img src="Image_URL_5"][/img]
[/bgallery]>
Youtube
To create youtube player just create code like below.

[youtube src="youtube_video_ID"/]
/*------- or -------*/
[youtube src="youtube_video_ID"][/youtube]
You can add more property like: width, height, info, control, playlist, and related.

Property Description Default
src Youtube Video ID. http://www.youtube.com/embed/VIDEO_ID
width Player width 100%
height Player Height 400
info this to change max item show in recentcomment widget. 5
control This parameter indicates whether the video player controls are displayed. For IFrame embeds that load a Flash player, it also defines when the controls display in the player as well as when the player will load. Supported values are:
0 – Player controls do not display in the player. For IFrame embeds, the Flash player loads immediately.
1 (default) – Player controls display in the player. For IFrame embeds, the controls display immediately and the Flash player also loads immediately.
2 – Player controls display in the player. For IFrame embeds, the controls display and the Flash player loads after the user initiates the video playback.
1
playlist This parameter specifies a comma-separated list of video IDs to play. If you specify a value, the first video that plays will be the VIDEO_ID specified in the URL path, and the videos specified in the playlist parameter will play thereafter.
related This parameter indicates whether the player should show related videos when playback of the initial video ends. Supported values are 0 and 1. 0
Dailymotion
To create dailymotion player just create code like below..

[dailymotion src="Dailymotion_video_ID"/]
/*------- or -------*/
[dailymotion src="Dailymotion_video_ID"][/dailymotion]
You can add more property like: width, height, highlight, background, color, info, and logo.

Property Description Default
src Dailymotion Video ID. http://www.dailymotion.com/embed/video/VIDEO_ID?PARAMS
width Player width 100%
height Player Height 270
highlight HTML color of the controls elements' highlights. 29b7ff
background HTML color of the background of controls elements 000000
color HTML color of the text. ffffff
info Shows videos information (title/author) on the start screen. Supported values are 0 and 1. 1
logo Allows to hide or show the Dailymotion logo. Supported values are 0 and 1. 1
Soundcloud
To create soundcloud player just create code like below..

[soundcloud src="Soundcloud_ID"/]
/*------- or -------*/
[soundcloud src="Soundcloud_ID"][/soundcloud]
You can add more property like: width, height, auto, color, visual, comments, user, and playlist

Property Description Default
src Soundcloud ID.
width Player width 100%
height Player Height 130
auto Whether to start playing the widget after it’s loaded. Supported values are false and true. false
color HTML color of the background of controls elements ff5500
visual To make it show player show visual. Supported values are false and true false
comments Show/hide comments. Supported values are false and true false
user Show/hide the uploader name. Supported values are false and true. true
playlist If you want show it playlist or not. isert playlist ID
Maps
To create google maps just create code like below.

[map src="Google_Maps_ID"/]
/*------- or -------*/
[map src="Google_Maps_ID"][/map]
/*------- complete code -------*/
[map width="Map_Width" height="Map_Height" src="Google_Maps_ID"/]
Exemple:


[map src="Google_Maps_ID"/]
To get Google Maps ID you can use this method

Went Search Location in Google Maps. https://www.google.com/maps
Click Gear Icon (bottom right) and Choose Share or embed map
and click Embed map and Copy code after the : https://www.google.com/maps/embed?pb= like below:

Shortcode will look like this:
[map src="!1m18!1m12!1m3!1d31733.083318326!2d106.82385317410909!3d-6.179531026100637!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2e69f3e945e34b9d%3A0x5371bf0fdad786a2!2sJakarta%2C+Special+Capital+Region+of+Jakarta!5e0!3m2!1sen!2sid!4v1433961860989"/]


Other Media
To create other media load using iframe just add code like below.

[media]Your Link Here[/media]
/*------- complete code -------*/
[media width="Media_Width" height="Media_Height"]Your Link Here[/media]
Tooltip
To create Tooltip just create code like below.

[tooltip url="Tooltip_URL" title="Tooltip_title"]Text/Element went mouse hover or enter the tooltip[/tooltip]
Exemple use:

In a few minutes there was, so far as the soldier could see, not a living thing left upon the common, and every bush and tree upon it that was not already a blackened skeleton was burning[tooltip url="http://themeforest.com/user/MARIthenes" title="MARIthenes"]The second monster followed the first, and at that the artilleryman began to crawl very cautiously across the hot heather ash towards Horsell.[/tooltip]The hussars had been on the road beyond the curvature of the ground, and he saw nothing of them. He heard the Martians rattle for a time and then become still. The giant saved Woking station and its cluster of houses until the last; then in a moment the Heat-Ray was brought to bear, and the town became a heap of fiery ruins.
Slider
To create a Slide make code like below.

[slide]
[item url="Image_Link_URL" src="Image_URL" title="Image_title"]Content Description[/item]
[item url="Image_Link_URL" src="Image_URL" title="Image_title"]Content Description[/item]
[item url="Image_Link_URL" src="Image_URL" title="Image_title"]Content Description[/item]
[item url="Image_Link_URL" src="Image_URL" title="Image_title"]Content Description[/item]
[item url="Image_Link_URL" src="Image_URL" title="Image_title"]Content Description[/item]
[/slide]
Carousel
To create a carousel make code like below.

[carousel]
[item url="Image_Link_URL" src="Image_URL" title="Image_title"]Content Description[/item]
[item url="Image_Link_URL" src="Image_URL" title="Image_title"]Content Description[/item]
[item url="Image_Link_URL" src="Image_URL" title="Image_title"]Content Description[/item]
[item url="Image_Link_URL" src="Image_URL" title="Image_title"]Content Description[/item]
[item url="Image_Link_URL" src="Image_URL" title="Image_title"]Content Description[/item]
[/carousel]
Note If you just use Shortcode in yours article, Populars Widget will not showing any of Image.

Table
To create a Table make code like below.

Label 1 Label 2 Label 3 Label 4
Description 1 Description 2 Description 3 Description 4
Description 1 Description 2 Description 3 Description 4
Note This HTML tag. yours Post editor must be in HTML

Review
To create a Review make code like below.

[review]
[content title="Description Title" label="Overall Score"]Your Summary Description Here[/content]
[item value="Value Here"]Description Here[/item]
[item value="Value Here"]Description Here[/item]
[item value="Value Here"]Description Here[/item]
[item value="Value Here"]Description Here[/item]
[item value="Value Here"]Description Here[/item]
[/review] Exemple:
[review]
[content title="Summary" label="Overall Score"]My fellow Earthicans, as I have explained in my book Earth in the Balance, and the much more popular Harry Potter and the Balance of Earth, we need to defend our planet against pollution. Also dark wizards but I know you in the future back in our hands.[/content]
[item value="7"]Gameplay[/item]
[item value="8"]Graphics[/item]
[item value="10"]Sound[/item]
[item value="5"]Ease of play[/item]
[item value="9"]Hardware[/item]
[/review]
Note If you just use Shortcode in yours article, Populars Widget will not showing any of Image.

Post Pagination
To create a carousel make code like below.

[page]
[item]Content Description[/item]
[item]Content Description[/item]
[item]Content Description[/item]
[item]Content Description[/item]
[item]Content Description[/item]
[/page]
Note If you just use Shortcode in yours article, Populars Widget will not showing any of Image.

Combine
You can combine each Shortcode, like use Tabs, Accordion, youtube and etc, in one Exemple

[tab]
[content title="Soundcloud"]
[soundcloud height="400" visual="true" src="Soundcloud_ID"][/soundcloud]
[/content]
[content title="Youtube"]
[youtube src="Video_ID"][/youtube]
[/content]
[content title="Maps"]
[map src="Google_Maps_ID"][/map]
[/content]
[content title="Accordion"]
[accordion]
[item title="Accordion 1"]Your Text Here[/item]
[item title="Accordion 2"]Your Text Here[/item]
[item title="Accordion 3"]Your Text Here[/item]
[/accordion]
[/content]
[/tab]
Note
Populars Post Widget Not Support Third Party Image and Shortcode
Don't Use Shortcode in first line on yours article. Because Summary length on Populars Post will cut. or maybe not display
Don't Use just shortcode in yours article. Because Image on Populars Post widget will not show. And maybe if you share yours blog link/article link, image thumbnail wil not show.
You can use Shortcodes not just in Post Editor but you can use it to in Comment post and HTML Widget

Shortcodes