Hello everyone, You must be knowing MBT- My Blogger Tricks, NO!!! Then just give it a view. Today MBT bring up a revolutionary change in blogger platform, by Introducing Blogger Shortcode Plugin.
You can now insert videos, audios, photo gallery, tabs, accordions, etc. with just a single line of code inside your posts, widgets, sidebars and also inside your Blog Comments!
So Lets get started and learn all about it!
Beforing starting with Shortcode implimentation, first see what actually shortcodes are?
Let's see what Mohammad said:-
Blogger shortcode is a macrocode i.e. a single line of code that contains a set of instructions which lets you do nifty things with no effort at all. Shortcodes can help you embed files or create objects in BlogSpot blogs with a single line of code that would normally require a lot of complex, long ugly code.
You can now easily insert objects such as Videos, Audios, Files, Slideshows and all important web elements such as accordions, tabs, colorful buttons, boxes etc. inside Header, Sidebar, Footer, Posts, Pages, Titles and amazingly even inside comments! It requires no prior knowledge of HTML, CSS or JavaScript. The plugin is extremely lightweight and its multiple-embed-support will reduce your Page Load time by 50%.
List Of Shortcodes Developed
Original appeared on MBT
MBT is planning to develop around 50 shortcodes within a month. Shortcodes will be created based on their importance and usability. To get all the latest updates about Blogger Shortcodes, Subscribe Us!
Given Below are the shortcodes developed by MBT till now.
MBT is planning to develop around 50 shortcodes within a month. Shortcodes will be created based on their importance and usability. To get all the latest updates about Blogger Shortcodes, Subscribe Us!
Given Below are the shortcodes developed by MBT till now.
| Shortcode | Definition |
|---|---|
| [accordion] | Accordion is a vertically stacked list of items where each item can be "expanded" or "stretched" to reveal the content associated with that item. Items can be Toggled on and off easily. An example is theaccordion widget |
| [tab] | Tab widget allows multiple documents or panels to be contained within a single window, using tabs as a navigational widget for switching between sets of document. An example is the Multi Tab Widget |
| [ code] | Embeds syntax Highlighter which preserves the original formatting of source code |
| [quote] | Inserts a Fancy Blockquote |
| [button] | Inserts colorful CSS3 Buttons |
| [icon] | Insert FontAwesome icons anywhere with custom options support |
| [soundcloud] | Embeds SoundCloud Track |
| [dailymotion] | Embeds Dailymotion Video |
| [divider] | Inserts a Horizontal Separator to divide a section, also contains a Back To Top button |
| [num] | Inserts a Number enclosed inside a circular background |
| [warning] | Inserts a box with Warning message |
| [success] | Inserts a box with Success message |
| [alert] | Inserts a box with Alert message |
| [info] | Inserts a box with Some Information message |
| [update] | Inserts a box with Update status message |
Also Read:
Install Blogger Shortcode Plugin
The most important step to make the Blogger Shortcode to work is to add Blogger Shortcode Plugin, which actually consists of - One Dynamically updated JS file (Updated By MBT)
- 3 CSS files (Published By MBT)
Follow the 2 easy steps to add Blogger Shortcode Plugin on your blog, given below:
Originally Steps where posted on MBT.- Go To Blogger > Template > Backup your template
- Click Edit HTML
- Search </body>
- Paste the following dynamically updated JS file just above it
[code]<!-- Blogger Shortcode Plugin Dynamic JS File -->
<script src='http://downloads.mybloggertricks.com/shortcodes.js' type='text/javascript'></script>
[/code]
- Next Search For <head>
- Paste the following CSS files just below it
[code]
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script> <link href='http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css' rel='stylesheet'/> <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>
[/code]
- Save your template and you are all done!
So now you have successfully added Blogger Shortcode Plugin to your blog.
Also Read:
The most important step to make the Blogger Shortcode to work is to add Blogger Shortcode Plugin, which actually consists of
- One Dynamically updated JS file (Updated By MBT)
- 3 CSS files (Published By MBT)
Follow the 2 easy steps to add Blogger Shortcode Plugin on your blog, given below:
Originally Steps where posted on MBT.
- Go To Blogger > Template > Backup your template
- Click Edit HTML
- Search </body>
- Paste the following dynamically updated JS file just above it
[code]<!-- Blogger Shortcode Plugin Dynamic JS File -->
<script src='http://downloads.mybloggertricks.com/shortcodes.js' type='text/javascript'></script>
[/code]
<script src='http://downloads.mybloggertricks.com/shortcodes.js' type='text/javascript'></script>
[/code]
- Next Search For <head>
- Paste the following CSS files just below it
[code]
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script> <link href='http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css' rel='stylesheet'/> <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>
[/code]
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script> <link href='http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css' rel='stylesheet'/> <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>
[/code]
- Save your template and you are all done!
So now you have successfully added Blogger Shortcode Plugin to your blog.
Also Read:
Also Read:
0 comments:
Post a Comment