Complete Guide to Using Shortcodes

Posted by templatic in Templatic Framework April 25, 2011 | 2
world news,information newsinformationwp plugin

What are Shortcodes ?
Shortcodes are like shortcuts. Just use a particular shortcode and your task is done. We have built some custom shortcodes for you, which will make your task easier. The shortcodes make it easy to add stylised content to your site, plus they’re very easy to use. Each shortcode is made for a particular purpose and you can use these shortcodes, in a post, pages, and even in widgets. For a more detailed explanation on this topic, you may even like to check out the Codex for Shortcodes.

How to use Shortcodes:
Don’t worry, using shortcodes is very easy. You just have to write the particular shortcode and wrap your text in between. Below is an example. Suppose we want to use Alert info box.

Just type in this code and then write your alert message (text) here and close by writing this . Its this easy, the text written in between this code will have the effect.

This theme comes with many built in shortcodes. Below is a list of shortcodes which you will find in this theme.

Info Boxes

These info boxes are used to highlight some special parts. Below is the example of info box.

Download Download text here /Download

Download: Look, you can use me for highlighting some special parts in a post. I can make download links more highlighted.

Alert Alert text here /Download

Alert: Look, you can use me for highlighting some special parts in a post. I can be used to alert to some special points in a post.

Note Note text here /Note

Note: Look, you can use me for highlighting some special parts in a post. I can be used to display a note and thereby bringing attention.

Info Info text here /Info

Info: Look, you can use me for highlighting some special parts in a post. I can be used to provide any extra information.

Author Info Author Info text here /Author Info

About The Author

Use me for adding more information about the author. You can use me anywhere within a post or a page, i am just awesome. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing.

Button List

You can use these buttons and add a link and text, as per your wish.

Small_Button class="red" <a href="#"> Button text here /Small_Button

Available button colors: red, grey, black, blue, lightblue, purple, magenta, green, orange, yellow, pink.

Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text
Button Text

Icon list view

Icon List <ul><li>Unordered list here<li></ul> /Icon List

  • Use the shortcode to add this attractive unordered list
  • SEO options in every page and post
  • 5 detailed color schemes
  • Fully customizable front page
  • Excellent Support
  • Theme Guide & Tutorials
  • PSD File Included with multiple use license
  • Gravatar Support & Threaded Comments
  • Inbuilt custom widgets
  • 30 built in shortcodes
  • 8 Page templates
  • Valid, Cross browser compatible

Dropcaps Content

Dropcaps Paragraph here /Dropcaps

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy.

Dropcaps can be so useful sometimes. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy.

Content boxes

We, the content boxes can be used to highlight special parts in the post. We can be used anywhere, just use the particular shortcode and we will be there.
Normal_Box Normal Box content here /Normal_Box

Normal Box

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy.

Warning_Box Warning Box content here /Warning_Box

Warning Box

This is how a warning content box will look like. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy.

Download_Box Download_Box text here /Download_Box

Download Box

This is how a download content box will look like. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy.

About_Box About_Box text here /About_Box

About Box

This is how about content box will look like. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus.

Info_Box Info_Box text here /Info_Box

Info Box

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy.

Alert_Box Alert_Box text here /Alert_Box

Alert Box

This is how alert content box will look like. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy.

Info_Box_Equal Info_Box_Equal text here /Info_Box_Equal
Alert_Box_Equal Alert_Box_Equal text here /Alert_Box_Equal
About_Box_Equal About_Box_Equal text here /About_Box_Equal

Info Box

This is how info content box will look like. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Use this shortcode for this type of Info box. [ Info_Box_Equal ]

Alert Box

This is how alert content box will look like. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Use this shortcode for this type of alert box. [ Alert_Box_Equal ]

About Box

This is how about content box will look like. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, commodo porttitor. Use this shortcode for this type of about box. [ About_Box_Equal ]

Similarly write shortcodes for One_HalfOne_Half_LastOne_ThirdOne_Third_LastOne_FourthOne_Fourth_LastTwo_ThirdTwo_Third_Last.

One Half Column

This is one half column shortcode. Its used to show the content in two columns. The text written here will be in left side column. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. One_Half

One Half Column

This is one half last column shortcode. Its used to show the content in two columns. The text written here will be in right side column. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. One_Half_Last

One Third Column

This is one third column shortcode. Its used to display content in three columns, as shown here. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. One_Third

One Third Column

This is one third column shortcode. Its used to display content in three columns, as shown here. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. One_Third

One Third Column

This is one third last column shortcode. Its used to display content in three columns, as shown here. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, quam ante ac quam. One_Third_Last

One Fourth Column

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in to the.One_Fourth

One Fourth Column

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in to the.One_Fourth

One Fourth Column

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in to the.One_Fourth

One Fourth Column

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in to the.One_Fourth_Last

One Third Column

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus. One_Third

Two Third Column

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. in, commodo porttitor, felis. Nam blandit quam ut lacus.in, commodo porttitor, felis. Nam blandit quam ut lacus. Two_Third_Last

Two Third Column

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. in, commodo porttitor, felis. Nam blandit quam ut lacus.in, commodo porttitor, felis. Nam blandit quam ut lacus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Two_Third

One Third Column

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. One_Third_Last

Here’s a video tutorial depicting how to use Shortcodes

Online presence for your enterprise with enterprise Facelift your WebHosting business website

Connect with us

Newsletter

Get the latest updates on our amazing themes!

FREE test drive.
Try before you Buy

Did you know that you can Create a free test site (how?) and explore how it works in the backend before you purchase?

Create a test site now ยป

Templatic
  • Themes
  • Club
  • Support
    • Support Center
    • FAQ
    • Knowledgebase
    • Community forum
    • Helpdesk
  • News Blog
  • More
    • Templatic
      • About
      • Why us?
      • Testimonials
      • Affiliates
      • Jobs
    • Themes
      • View Our Themes
      • The club
      • FAQ
      • Test a Theme
      • Showcase
      • Developers
    • More
      • Installation Service
      • Pre-sales FAQ
      • Showcase
      • Developers
      • Web Hosting
      • Contact Us
  • My account
Going Up?

Templatic

  • About
  • News Blog
  • Testimonials
  • Contact Us

Products

  • Our Themes
  • Premium Themes Club
  • Pre-Sales FAQ
  • Test a Theme
  • Showcase

Support

  • Support Center
  • Support FAQ
  • Knowledgebase
  • Community forum
  • Helpdesk

About Templatic

Templatic creates out of the box Premium WordPress Themes that helps you make you make money online. Make your online presence quick, easy and affordable. Read more »

Affiliates| Support policy| Terms & Conditions| Contact

© 2013 Templatic. All rights reserved.

Proudly made in India by R.Bhavesh & team.