Ads (728x90)

Latest Post

Kesehatan

Tips


1. Log in to your dashboard--> layout- -> Edit HTML

2. Click on "Expand Widget Templates"

3. Search "Ctrl+F" and find </head>.Right before it paste the next code:

<script type="text/javascript" src="http://descarca.googlecode.com/files/jquery.js"></script>

<script type="text/javascript">
$(document).ready(function(){

$(".pane-list li").click(function(){
window.location=$(this).find("a").attr("href");return false;
});

}); //close doc ready
</script>

4. Now find ]]></b:skin> and before it add the following code:

<style type="text/css">
body {
margin: 10px auto;
width: 470px;
}
a {
color: #333300;
text-decoration: none;
}
a:visited {
color: #333300;
}
a:hover {
color: #333300;
text-decoration: underline;
}
h3 {
margin: 0;
padding: 0 0 .3em;
}
p {
margin: 0;
padding: 0 0 .5em;
}
.pane-list {
margin: 0;
padding: 0;
list-style: none;
}
.pane-list li {
background: #ecfad7;
padding: 10px 20px 10px;
border-top: solid 1px #c4df9b;
cursor: pointer;
}
.pane-list li:hover {
background: #f6ffe9;
}
</style>

5. Now go to Layout-->Page Element and click on "Add a gadget". Select "html/java script" and add the code given below and click save.

<ul class="pane-list">
<li>
<h3><a href="http://www.artistutorials.co.cc">Artisteer Tutorials</a></h3>
<p>Artisteer tutorials, tips&tricks</p>
</li>
<li>
<h3>WebloDesign</h3>
<p>Featuring the best <a href="http://www.weblodesign.co.cc">Templates for blogger</a></p>
</li>
<li>
<h3>Design Studio</h3>
<p><a href="http://www.artistutorials.co.cc">Blog</a> and design portfolio </p>
</li>
</ul>

Change the dummy text with your own.

DEMO

Post a Comment