Shortcodes

Divider
The divider is a container that holds some content and is finished by a dotted line to separate it from the content below it. To create this, simply wrap any content inside the [row_divider] shortcode in the editor as in the example below.

[row_divider]content[/row_divider]

Columns
Column shortcodes allow you to lay your content out in 2, 3, 4, 5 and 6 columns. This can be a combination text, images, videos etc. To do this, you will need to use the relevant shortcode below, noticing that the final one for each set has ‘_last’ there so the theme knows which is the closing column.

[half]content[/half]
[half_last]content[/half_last]

[third]content[/third]
[third]content[/third]
[third_last]content[/third_last]

[fourth]content[/fourth]
[fourth]content[/fourth]
[fourth]content[/fourth]
[fourth_last]content[/fourth_last]

[fifth]content[/fifth]
[fifth]content[/fifth]
[fifth]content[/fifth]
[fifth]content[/fifth]
[fifth_last]content[/fifth_last]

[sixth]content[/sixth]
[sixth]content[/sixth]
[sixth]content[/sixth]
[sixth]content[/sixth]
[sixth]content[/sixth]
[sixth_last]content[/sixth_last]

Alerts

6 alert boxes have been styled up for use in Pegasus Pro. These are for:

  1. Information Box
  2. Error Box
  3. Alert Box
  4. Download Box
  5. Tick Box
  6. Help Box

Simply add the shortcode as below with the content you want inside and a nicely styled full-width box holding the content will be generated for you. There’s nothing stopping you from adding these inside a column shortcode too as all our shortcodes can be nested inside one another.

[info_box]This is an info box[/info_box]
[error_box]This is an error box[/error_box]
[alert_box]This is an alert box[/alert_box]
[download_box]This is a download box[/download_box]
[tick_box]This is a tick box[/tick_box]
[help_box]This is a help box[/help_box]

Back to top
This is a shortcode that adds a simply ‘back to top’ link and divider to your page. Once clicked, there is an animation created to scroll you back to the top smoothly.

[back_to_top]Back to top[/back_to_top]

Buttons
3 styled shortcode buttons have been created for your use. Examples of the usage can be seen below where the ‘href’ in the shortcode tag is where you would like the button to link to. All 3 sizes are styled the same in differing ratios.

[button_small href="http://www.google.com"]Small Button[/button_small]
[button_standard href="http://www.google.com"]Standard Button[/button_standard]
[button_large href="http://www.google.com"]Large Button[/button_large]

Lightbox Single Image
Everyone likes lightbox images, right? Well we’ve added them to this theme for you so you can easily add them in to your posts/pages. Simply use the example below to create the lightbox effect.

Options for this shortcode are as follows:

‘large’ – this is the URL of the large image that will open up in the lightbox.
‘thumb’ – this is the thumb of the image that is to be click.
‘alt’ – should you wish to add an alt tag to the image
‘title’ – should you wish to add a title to the image

[lightbox_single large="http://localhost/wordpress-themes.com/pegasus-pro/files/2011/07/Green-Sea-Turtle.jpg" alt="Image Title" title="Image Title" thumb="http://localhost/wordpress-themes.com/pegasus-pro/files/2011/07/portfolio-item.jpg"]

Lightbox Gallery
What’s better than easily adding a lightbox image to your post/page? Adding a lightbox gallery!
Options here are the same a single lightbox image, only you should separate each image, thumb, title, alt by a comma. Please see the example below for confirmation on how to do this.

[lightbox_gallery large="http://localhost/wordpress-themes.com/pegasus-pro/files/2011/07/Green-Sea-Turtle.jpg,http://localhost/wordpress-themes.com/pegasus-pro/files/2011/07/Green-Sea-Turtle.jpg,http://localhost/wordpress-themes.com/pegasus-pro/files/2011/07/Green-Sea-Turtle.jpg" alt="Image Title" title="Image Title,Image Title 2,Image Title 3" thumb="http://localhost/wordpress-themes.com/pegasus-pro/files/2011/07/portfolio-item.jpg"]

Lightbox Flash
This shortcode allows you to add a Flash .swf file to lightbox. Add the URL to the .swf file, the height and width and the theme will take care of the rest for you :)

[lightbox_flash url="http://www.adobe.com/products/flashplayer/include/marquee/design.swf" title="Flash" height="294" width="792"]Flash[/lightbox_flash]

Lightbox YouTube
This shortcode allows you to add a YouTube video to lightbox. Add the full YouTube URL to the video and the theme will take care of the rest for you :)

[lightbox_youtube url="http://www.youtube.com/watch?v=qqXi8WmQ_WM" title="Youtube Video"]YouTube video[/lightbox_youtube]

Lightbox Vimeo
This shortcode allows you to add a Vimeo video to lightbox. Add the full Vimeo URL to the video and the theme will take care of the rest for you :)

[lightbox_vimeo url="http://vimeo.com/8245346" title="Vimeo Video"]Vimeo video[/lightbox_vimeo]

Lightbox Quicktime
This shortcode allows you to add a Quicktime video to lightbox. Add the full URL to the video, the height and width and the theme will take care of the rest for you :)

[lightbox_quicktime url="http://trailers.apple.com/movies/universal/despicableme/despicableme-tlr1_r640s.mov" height="360" width="640" title="Quicktime Video"]Quicktime video[/lightbox_quicktime]

Lightbox Website
This shortcode allows you to add an iframe of a website to your website. In our example, you will see that frogsthemes.com opens up in lightbox without having to leave the page.

[lightbox_website url="http://www.frogsthemes.com" title="frogsthemes.com"]frogsthemes.com[/lightbox_website]

Nesting Shortcodes
All our shortcodes can be nested inside one another so you can make the most of them.
For example, why not add 3 lightbox images inside 3 columns? Here’s how:

[third] [lightbox_single large="http://localhost/wordpress-themes.com/pegasus-pro/files/2011/07/Green-Sea-Turtle.jpg" alt="Image Title" title="Image Title" thumb="http://localhost/wordpress-themes.com/pegasus-pro/files/2011/07/portfolio-item.jpg"][/third]
[third] [lightbox_single large="http://localhost/wordpress-themes.com/pegasus-pro/files/2011/07/Green-Sea-Turtle.jpg" alt="Image Title" title="Image Title" thumb="http://localhost/wordpress-themes.com/pegasus-pro/files/2011/07/portfolio-item.jpg"][/third]
[third_last] [lightbox_single large="http://localhost/wordpress-themes.com/pegasus-pro/files/2011/07/Green-Sea-Turtle.jpg" alt="Image Title" title="Image Title" thumb="http://localhost/wordpress-themes.com/pegasus-pro/files/2011/07/portfolio-item.jpg"][/third_last]

 

Note: To get spacing correct on your site, you may need to remove line breaks from the shortcodes in the editor and display them in a single line E.g:

[third]content[/third] [third]content[/third] [third_last]content[/third_last]

Have more questions? Submit a request

0 Comments

Please sign in to leave a comment.
Powered by Zendesk