Interesting? Well, I have implemented the hack within the article on the demo blog whereas you can implement the same anywhere on your blogger template. Few examples include adding it to the sidebar with facebook like box, adding the hack to wrap the featured section, add the effect below your articles to show the share icons/author info widget, etc... So, let's get started.
1. Navigate to "Design>>Edit HTML" and make a backup of your template by clicking on the "Download full template" link at the top of the page. Once the back up is over, search for the following piece of code.
border-top: solid 0px #422410;
background: url(https://lh3.googleusercontent.com/-D9jcONOXd-Y/Ti-2VLRfmII/AAAAAAAABYU/NaQTyuOAnpo/s144/orange-slide.png) no-repeat center top;
background: url(https://lh5.googleusercontent.com/-t8bcqIqAylk/Ti-2VtdLOAI/AAAAAAAABYg/VvElRnH_e4Y/s800/white-arrow.gif) no-repeat right -50px;
padding: 8px 10px 0 0;
margin: 0 auto;
font: bold 120%/100% Arial, Helvetica, sans-serif;
background-position: right 12px;
5. Now, insert the following tags anywhere in your template - may be within the post editor (or) on your template. Replace YOUR CONTENT HERE with any content you want - it can be a script or an image or a link, anything under the earth... lol....
YOUR CONTENT HERE
<a href="#" class="btn-slide">Slide Panel</a>
The above slide panel effect was tested to work on all major browsers - IE, Firefox, Chrome, Opera. We are happy to inform our readers that some of my design articles have started to appear on the famous design site - Design News. I hope we'll be able to provide such quality articles in the future as well! Share your opinions via comments!