Jika anda berminat untuk menggunakan tab menu yang telah dimasukkan dengan widget Recent Comments, Top Commentators dan Popular Posts, sila ikut beberapa langkah yang mudah dibawah.
Langkah 1
Log in blog => Dashboard => Layout => Edit HTML.
Langkah 2
Dengan menggunakan keyboard, tekan kekunci Ctrl dan F secara serentak dan bar Find akan muncul. Seterusnya, taip atau paste kod ]]></b:skin> pada ruang Find dan kemudian tekan Enter.
Langkah 3
Salin kod biru dibawah dan kemudian, paste kod tersebut diatas atau sebelum kod ]]></b:skin> pada script template(rujuk langkah 2)
UL.tabNavigation {
list-style: none;
margin: 0 5px;
padding: 0;
}
UL.tabNavigation LI {
display:inline;
}
UL.tabNavigation LI A {
padding: 3px 10px;
-moz-border-radius-topleft:7px;
-moz-border-radius-topright:7px;
background-color: #1180FE;
color: #fff;
text-decoration: none;
}
UL.tabNavigation LI A.selected,
UL.tabNavigation LI A:hover {
background-color: #888888;
color: #fff;
padding-top: 7px;
}
UL.tabNavigation LI A:focus {
outline: 0;
}
div.tabs > div {
padding: 5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
margin-top: 0px;
border: 3px solid #ccc;
}
div.tabs > div h2 {
margin-top: 0;
}
#first {
background-color: #fff;
}
#second {
background-color: #fff;
}
#third {
background-color: #fff;
}
Langkah 4
Sekali lagi pada bar Find,taip atau paste kod </head> dan seterusnya, tekan Enter.
Langkah 5
Salin kod merah dibawah dan paste diatas atau sebelum kod </head>(rujuk langkah 4)
<script src="http://sites.google.com/site/defaultjssite/jquerytabmenu.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
$(function () {
var tabContainers = $('div.tabs > div');
tabContainers.hide().filter(':first').show();
$('div.tabs ul.tabNavigation a').click(function () {
tabContainers.hide();
tabContainers.filter(this.hash).show();
$('div.tabs ul.tabNavigation a').removeClass('selected');
$(this).addClass('selected');
return false;
}).filter(':first').click();
});
</script>
Seterusnya, klik SAVE TEMPLATE.
Langkah 6
Klik Layout => Add A Gadget => HTML/Javascript
Langkah 7
Salin kod hijau dibawah dan paste pada notepad. Edit kod yang di bold dengan menggantikannya dengan URL blog nama anda.
<div class="tabs">
<ul class="tabNavigation">
<li><a href="#first">First</a></li>
<li><a href="#second">Second</a></li>
<li><a href="#third">Third</a></li>
</ul>
<div id="first">
<h3>Recent Comments</h3>
<script style="text/javascript" src="http://sites.google.com/site/testingsahaja/recentcomments.js"></script><script style="text/javascript">var numcomments = 5;var showcommentdate = false;var showposttitle = false;var numchars = 40;</script><script src="http://URL blog anda.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>
</div>
<div id="second">
<h3>Top Commentators</h3>
<p><script type="text/javascript"> function pipeCallback(obj) { document.write('<ol>'); var i; for (i = 0; i < obj.count ; i++) { var href = "'" + obj.value.items[i].link + "'"; if(obj.value.items[i].link == "") var item ="<li>" + obj.value.items[i].title + "</li>"; else var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>"; document.write(item); } document.write('</ol>'); } </script> <script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=7b5e76fd684f11e94320abd4e00fbbca&url=http%3A%2F%2FURL blog anda.blogspot.com&num=10&filter=nama anda" type="text/javascript"></script></p>
</div>
<div id="third">
<h3>Popular Posts</h3>
<p><script language="JavaScript">
aBold = false;
numposts=1000;
maxshowresult=5;
home_page = "http://URL blog anda.blogspot.com/";
</script>
<script src="http://sites.google.com/site/testingsahaja/toppost.js" type="text/javascript"></script></p>
</div>
</div>
Lagkah 8
Salin kod yang telah siap diedit (rujuk langkah 7) dan paste pada ruang Content HTML/Javascript(rujuk langkah 6)
Akhir sekali klik Save.
0 comments:
Post a Comment