By adding keyboard keys effect in your blog post. You can make your post more stylish. Maybe you have seen this effect on many blogs. The Author use this effect to displaying the keyboard key effects on their desired text. Example when we add a keyboard shortcut effect like CTRL+F It looks simple. But we can make it stylish by using the <kk> tag. With this tag, your keys look like keyboard keys. CTRL+F.


How To Add Beautiful Keyboard Keys Effect In Blogger Post



Add Keyboard keys Effect In Blogger Post

  1. Go to the Blogger.com and log in your account.
  2. Select your blog where you want to add keyboard keys effect.
  3. From the blog, dashboard click on the template option.
  4. Go the edit HTML page by clicking on the Edit HTML button. 
    How To Add Beautiful Keyboard Keys Effect In Blogger Post
  5. In the next page, you will see your template code. 
    How To Add Beautiful Keyboard Keys Effect In Blogger Post
  6. Click anywhere on the code. And search for </b:skin> By pressing CTRL+F.
  7. After finding the tag paste the following CSS before </b:skin>.
kk{
border:1px solid #333; 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; }

Finally, click on the save changes button. And you are done. Now, whenever you want to use keyboard keys effect. You can do it by wrapping your text with <kk>. Like <kk>CTRL</kk>+<kk>F</kk>.

That's it. Thanks for reading my this post. Keep visiting for more useful posts. If you have any question about this post you can ask me by dropping your comment.

3 comments: