How To Add Stylish Keyboard Keys In Blogger Posts

In today's we are going to release stylish Css keyboard for blogger posts. These keys brings more beauty, attractiveness and make your blog more designable. We also alerted all the users of blogspot that they can show a stylish and attractive keyboard keys instead of selective text. They keys are developed in CSS3 to design and have no image or photo, which cannot increase the loading time of your blog. So if your are the true reader of TBT then you might be familiar that recently also shared an Attractive Table Contents Page Sitemap and today we have another splendid tutorial to show you a complete guide. So in this article we are going to guide you that how to add a stylish keyboard keys in blogger posts to make it more designable.

Why To Show The CSS3 Stylish Keyboard Keys In Blogger Posts

Blogger is full of fun and fully customizable even a teenager customize it easily in less a minute. Every a single day bundles of blogger templates releasing with unique stylish designing. So if you want to make your blog more designable you have analyzed each and every corner of the blog. We can also the default text in blogger to switch into Css stylish designing. Generally we use to show blogger default keyboard inside posts whenever learning how to gadget or something like that. Now being as professional blogger that have to understand that we need to add CSS3 designing keyboard  keys to help the newbies very well instead of showing default text.

Adding Css Keyboard Keys In Blogger Template

First of all we have to add a CSS3 code inside blog template. We will copy the below code and paste it inside the template. So whenever we want to write an article and want to add a designable keyboard keys, we need to call by spicific id's or class.

• Login to blogger dashboard.
• Goto Template and click on Edit Html.
• Search the below code.

]]></b:skin>

• Copy the below code and paste above/before ]]></b:skin>

kbd{
border:1px solid gray;
font-size:1.2em;
box-shadow:1px 0 1px 0 #eee, 0 2px 0 2px #ccc, 0 2px 0 3px #444;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
margin:2px 3px;
padding:1px 5px;
}

• Save your template.

Now  whenever you want to write a new post and want to add a stylish keys of keyboard in specific location you will need to add to the below code inside blogger post editor html.

<kbd>Ctrl</kbd> + <kbd>F</kbd>

•  After enclosing you text inside the above tags. then the text will be looks like the below image.

Need Help

We are confident about this tutorial and hope you learned How To Add Stylish Keyboard Keys In Blogger Posts. If you have still problem and confuse and do not do the customization then we want to post your query in comment box and we will solve your problem as soon as possible. If you wan to know more about blogging tricks then visit our TBT Gadget Portion. Thanks and hope to you next tutorials.