Follow Gautam Thapar on EnvatoFollow Gautam Thapar on Twitter

Even Better Than Before! – Version 1.5.4 – 11th July, 2014.

GT Shortcodes is a premium WordPress plugin that boosts your WordPress site/theme with simple, clean, flat & awesome looking user interface elements in the form of simple shortcodes. Creating short codes is so easy with the help of short code editor dialog boxes or the so called shortcodes generator.

Talking about numbers, there are unlimited UI element possibilities if taking into consideration all the variations, styles, types, etc.

NEW! in Version 1.5.4

  • Icon List – DEMO

What Customers are Saying

GT Shortcodes Review

NEW! in Version 1.5.3

  • Google PieChart – DEMO

NEW! in Version 1.5

  • Charts
  • Google Maps

NEW! in Version 1.4.2

  • Code Blocks

NEW! in Version 1.4

  • Blockquotes
  • Highlight
  • Horizontal Rules
  • Visibility

NEW! in Version 1.3

  • Animating / Shuffling Numbers
  • Responsive Banner Ads
  • Enhanced Progress Bars

NEW! in Version 1.2

  • 60+ Animations
  • Lazy Load Images
  • QR Codes

NEW! in Version 1.1

  • 360+ Font Awesome Icons
  • Awesome Pricing Tables
  • Super Columns

Silent Features

  • Supports WordPress 3.3+
  • Based on Twitter Bootstrap
  • Supports Bootstrap 2.3.2 & 3
  • Simple,Clean,Flat Designed Elements
  • Responsive Elements
  • Elements Adapt To Bootstrap Theme Style
  • Light Weight Plugin
  • No Load On Database
  • Automatically Clears It’s Data From Database On De-activaton
  • Shortcode Dialog Boxes / Shortcode Generator To Easily Print Shortcodes
  • Works With Bootstrap Based Themes & Even With Non-Bootstrap Based Themes
  • Control Over CSS & JS Files. Enable or Disable As Required
  • Shortcodes Works in Posts, Pages and Widgets.
  • You can also add shortcodes in php template files by placing the shortcode inside do_shortcode function, like shown below -
                <?php echo do_shortcode('[gtglyph]'); ?>
  • Documentation
  • Vast Browser Support
  • Awesome Support


  • Google PieChart [NEW]: A pie chart that is rendered within the browser using SVG or VML. Displays tooltips when hovering over slices. DEMO
  • Charts [NEW]: Easy, object oriented client side graphs for everyone. Visualise your data in different ways. Each of them animated, fully customisable and look great, even on retina displays. DEMO
  • Google Maps [NEW]: Google Maps can be used a locator for urban businesses in numerous countries around the world. DEMO
  • Animating / Shuffling Numbers: Animated numbers or shuffling numbers are much in fashion these days. They are good for grabbing attention of users to show off vital stats. DEMO
  • Responsive Banner Ads: Banner ads come with all the standard web banner sizes but you can also define custom sizes. If no image source is defined then a placeholder image is displayed. Short codes work in widgets too! DEMO
  • Animations: 60+ Animations! An animation is an effect that lets an element gradually change from one style to another. You have the option to rotate, fade, flip, bounce, slide and more. There are four ways to trigger an animation such as on page load, on page scroll, on click and on hover. Not only this, for every animation you can set the duration, iteration, direction, timing, mode and delay options. DEMO
  • Lazy Load Images: Save your website bandwidth + Load your pages faster using Lazy Load Images! Optimize browser rendering and reduce number of HTTP round-trips by deferring the loading of images which are not in the viewport. Using Lazy Load on long web pages containing many large images makes the page load faster. Browser will be in ready state after loading visible images. In some cases it can also help to reduce server load. DEMO
  • QR Codes: 6 Type of QR Codes with the option to set different image sizes! A QR code consists of black modules (square dots) arranged in a square grid on a white background, which can be read by an imaging device (such as a camera) and processed using Reed–Solomon error correction until the image can be appropriately interpreted; data is then extracted from patterns present in both horizontal and vertical components of the image. DEMO
  • Accordions: Accordions are used to display content in collapsible content panels. Adds a collapsible accordion to the page. DEMO
  • Alerts [ENHANCED]: Alerts are used to provide important information to users. Adds an alert box to the page. DEMO
  • Blockquotes: A blockquote is a section quoted from another source. DEMO
  • Buttons [ENHANCED]: A button is a user interface element which once clicked triggers an event. Adds a clickable button to the page. DEMO
  • Carousel: Carousel is an image rotator. It is also known as slider. Adds a carousel to the page. DEMO
  • Columns: Column layout enables content to be flowed into multiple columns, which retain a gap and an optional rule between them. It also makes it possible to vary the number of columns based on the size of the browser window. Adds a column to the page. DEMO
  • Font Awesome Icons: Font Awesome gives you scalable vector icons that can instantly be customized. Adds a font awesome icon to the page. DEMO
  • Glyphicons: Glyphicons are precisely prepared monochromatic icons and symbols, created with an emphasis on simplicity and easy orientation. Adds a glyphicon to the page.
  • Highlight: Highlight text is useful for highlighting/pointing out important text lines or words in a paragraph. DEMO
  • Horizontal Rules: Horizontal rules / dividers marks the end of a section. DEMO
  • Icon List: Use any of the 439 font awesome icons in the list. It supports custom icon size & colour. And you can position icon to the left or right of list item text. DEMO
  • Labels: Labels are used to identify or designate, describe or classify something. Adds a label to the page. DEMO
  • Popovers: A popover is an overlay which covers the material in a web browser without the need to create a new window. Adds a popover to the page. DEMO
  • Pricing Tables: Pricing tables play an important role for every company that offers products or services. They clearly differentiate between features and prices of different products and services. Adds a pricing table to the page. DEMO
  • Progress Bars [ENHANCED]: A progress bar is a component in a graphical user interface used to visualize the progression of an extended computer operation, such as a download, file transfer, or installation. Adds a progress bar to the page. DEMO
  • Switches: Switches are used toggle between two possibilities such as on or off. Adds a switch to the page. DEMO
  • Tabs [ENHANCED]: Tabs are used to organize content. Adds a tab to the page. DEMO
  • Tables: Tables are useful for presenting data in an organized manner. Tables are very useful for data comparisons, etc. Adds a table to the page. DEMO
  • Tooltips: A tooltip is a small, boxed text message that pops up when a mouse cursor hovers over an element. Adds a tooltip to the page. DEMO
  • Video Player: Video player is useful for playing videos and movies. Adds a video player to the page. DEMO
  • Visibility: Visibility is used for showing and hiding content based on a device. DEMO
  • and more soon..

Quick Demo Videos

Plugin installation and shortcodes usage videos.

Plugin Support

I will do my 200% to solve problems, if any. I will do my best to respond within 24 hours, generally quickly.

If you are looking for some particular UI element which is not included in this plugin then you can let me know about it using the contact form from here or through the comment section. If possible I will include that element in this plugin.

Let us together make this plugin BETTER!





v1.5.4 [10th July 2014] ------

1. Added Icon List.

1. Added text option in generator for buttons.
2. Updated progress bar script.
3. Added secondary text option in progress bars.
4. Updated font awesome to latest version (4.1) which includes 71 new icons.
5. Few other bug fixes.


v1.5.3 [15th April 2014] ------

1. Added Google PieChart

1. Added animation delay attribute to charts.
2. Charts are now responsive. Charts are initiated every time when screen size is changed.
3. Fixed errors displayed on options page when an option is not selected (provided you turned on wp_debug).
4. Ready to welcome WordPress 3.9!
5. For WordPress 3.9 and onwards, Iris color picker replaces JSColor color picker.


v1.5.2 [18th February 2014] ------

1. Added notice about bootstrap style in progress bar shortcode generator.
2. Fixed Button Background Color Issue.
3. Given low priority to plugin styles.
4. Added animation event and animation type attributes to Charts Shortcode.
5. Fixed Predefined Styles in Google Map Shortcode.
6. Fixed Google Maps script option appearing twice on options page.


v1.5.1 [14th February 2014] --------

1. Enhanced Tabs Shortcode.
2. Fixed Google Maps greyscale type.
3. Fixed Alert border radius issue.
4. Fixed Google Maps roadmap type.
5. Removed Glyphicons data-icon dependency.


v1.5 [3rd February 2014] --------

1. Added Google Maps shortcode.
2. Added Charts Shortcode.

1. Fixed code style inside paragraph for responsive themes.
2. Fixed body padding for smaller screens.
3. Fixed max height option visibility in code blocks shortcode when selecting <pre> tag.
4. Video.js updated to latest version 4.3.0.
5. Font Awesome updated to latest version 4.0.3.


v1.4.2.1 [26th January 2014] --------

1. Added custom class option to button shortcode.
2. Style fixes for progress bars.


v1.4.2 [18th January 2014] --------

1. Added Code Block shortcode.
2. Added white space option in horizontal rules shortcode.

1. Fixed button 'back to top' option.
2. Moved shortcode button to the first row of tinymce post editor.


v1.4.1 [13th December 2013] --------

1. Fixed background-repeat for short code icons (WordPress 3.8 related).


v1.4 [11th December 2013] --------

1. Highlight Text
2. Block quotes
3. Visibility
4. Horizontal Rules

5. Enhanced Buttons. Added Back To Top Link Option, custom border options and item animation option.
6. Enhanced Alerts.

7. Fixed button text uppercase issue.
8. Fixed alert overflow issue.
9. Fixed progress bar class conflict.
10. Fixed body style issue.


v1.3.1 [10th November 2013] --

Bug Fixes
1. Fixed version issue.
2. Fixed blank screen when selecting delete data on plugin deletion.


v1.3 [7th November 2013] --------

1. Added Animated / Shuffling Numbers.
2. Added Responsive Banner Ads.

3. Enhanced Progress Bars.
4. Now Accordions Support All Kind of Content like images, other short codes, links, etc.
5. Now Tabs Support All Kind of Content like images, other short codes, links, etc.
6. Now Tables Support All Kind of Content like images, other short codes, links, etc.

7. Fixed a little bug with ‘on hover animation’ in bootstrap 3 version.
8. Other minor improvements and fixes.


v1.2.1 Bug Fix [30th October 2013] ---

1. Fixed a bug in button short code where multiple quotes were getting added to the href attribute.
2. Added an option to choose button link target.
3. Added settings link page under plugin name on plugins page.


v1.2.1 [28th October 2013] -----------

1. Added settings link directly under plugin name on plugins list page.

Major Accordion Enhancement - Now Get Full Control Over Accordion.
2. Added 14 Toggle Icons for Accordion.
3. Comma Separator is Now Replaced with a Pipe (vertical bar) Character.
4. Added Option to Choose Default Open Tab.
5. Added Control Over Accordion Border Size, Border Style, Border Radius & Border Color.
6. Added Option to Change Accordion Content Background.
7. Added Option to Change Accordion Content Text Color.

Button Enhancement
8. Added Option to Select Button HTML Tag. It makes it easy to use button within other 3rd party short codes. For example, you can use button within Ninja Popups short code to make popup appear on button click.

Font Awesome Icons Enhancement
9. Updated Font Awesome to Version 4.
10. Font Awesome 4 does not support IE7 so removed that option from options panel.
11. Added option to select minified version of font awesome stylesheet.


v1.2 [23rd October 2013] -----------

1. Added Animations.
2. Added QR Codes.
3. Added Lazy Load Images.

4. Options Page Visual Improvements.
5. Now user has the choice/control over data deletion from database, on plugin deactivation or on plugin deletion.
6. Added more control over scripts and styles.
7. Fixed Pricing Table padding issue.
8. Fixed Pricing Table responsiveness for 5 columns.

For Bootstrap version 3:
10. Added left and right tabs in bootstrap 3 version.

For Bootstrap version 2.3.2
11. Removed alignment option from tabs short code. Now only one option to select default, left or right tab style. Tabs short code need to be updated!


v1.1 [9th October, 2013] -----

1. Added 360+ Font Awesome Icons.
2. Added Pricing Tables.
3. Added Columns.
4. Improved Button Short Code. Now in place of [gtbutton] uses [gtbutton][/gtbutton] short code. Button text and icons can be added between short code tag.
5. Other Code Improvements.


v1 [3rd October, 2013] -

1. Initial Release