Back To Top

Learn easy Webdesign with HTML,HTML5,PHP,ASP,XML,SGML,Computer Programming,And many More...

How to Add Download, Nest, Previous, & Demo Button in Blogger Post

HOW TO ADD DOWNLOAD AND DEMO BUTTON WITH MOUSE HOVER EFFECT.

Guys, In this post we are going to show you how to add stylish demo and download buttons to your blog. You can use these CSS buttons instead of demo and download links.

You can find the demo below. Move your cursor on the button for hover effects:


FOLLOW THESE INSTRACTIONS:

  • Go To Blogger Dashboard > Template > Edit HTML
  • Backup your template before editing.
  • Search for this, ]]></b:skin> . before it paste the following CSS Code

.button {
-moz-border-radius:5px 5px 5px 5px;

  • Save your template.
Now whenever you want to add the demo or download button you only need to add the following code in the "EDIT HTML" section of your Blogger Editor

FOR DEMO BUTTON

<a class="demobutton button" href="YOUR DEMO LINK HERE" rel="nofollow" style="float: left;" target="_blank"><span style="display: inline-block;">Live Demo</span></a> 
FOR DOWNLOAD BUTTON
<a class="button downloadbutton" href="YOUR DOWNLOAD LINK HERE" rel="nofollow" style="float: left;" target="_blank"><span style="display: inline-block;">Download</span></a> 
  • Finally Publish Post
Download

Popular Posts