[Tutorial] Macam Mana Nak Buat Tab Navigation?

by - Monday, June 14, 2010



Salam. Hari ni macam mood tak baik sebab tu nak buat tutorial. Heh? Tetiba? =.="


Act aku rasa bersalah sangat-sangat dekat kakak blogger ini sebab dia banyak bagi tutorial dan dengan tutorial die lah aku dapat buat rainbow link, butang Share dan Like FB dan autohide shoutbox aku tue


Tapi baru-baru ini dia tanya aku macam mana nak buat tab navigation macam ini


dan aku tak boleh nak jawab sebab masa tu tab navigation aku tak berapa nak menjadi. Bila aku bagi link kat die, dia cakap tak boleh nak buat. Makaaaaaaa aku rasa bersalah sangat-sangat sebab die tak boleh buat.


Aku pon godek-godek internet, cari tutorial tab navigation dan akhirnya yeah ! Menjadi weh ! Kali ini lebih kemas aku rasa :D


Kebaikan tab navigation ini ialah korang dapat jimatkan ruang di sidebar korang. Tutorial yang aku bagi ini bakal guna 2 tab sahaja iaitu Komen Terkini dan Top Entry di blog anda :D

  • Pergi ke Dashboard > Design > Edit HTML
  • Tekan ctrl + f dan cari code </head>
  • Copy code di bawah dan pastekan DI ATAS atau SEBELUM </head>
<script src='http://www.tricksmachine.com/wp-content/uploads/2010/02/tabber.js' type='text/javascript'/>
<link MEDIA='screen' TYPE='text/css' href='http://www.tricksmachine.com/wp-content/uploads/2010/02/example.css' rel='stylesheet'/>

Save !

  • Pergi ke Design > Add A Gadget > Page Elemente > HTML Java Script
  • Copy code di bawah dan pastekan di HTML Java Script

<div class="tabber">

<div class="tabbertab">
<h2>Komen</h2>
<p></p>
<script style=text/javascript src=http://edriena-hazelina.googlecode.com/files/recent-comments.js ></script><script style=text/javascript >var a_rc=8;var m_rc=false;var n_rc=true;var o_rc=100;</script><script src=URL ANDA DI SINI/feeds/comments/default?alt=json-in-script&callback=showrecentcomments ></script>

</div>


<div class="tabbertab">
<h2>Top</h2>
<p></p>
<script language="JavaScript">
aBold = false;
numposts=1000;
maxshowresult=10;
home_page = "URL ANDA DI SINI/";
</script>
<script src="http://edriena-hazelina.googlecode.com/files/toppost.js" type="text/javascript"></script>

</div></div>


*Nombor 8 yang di BOLDkan itu ialah bilangan komen yang korang nak. Korang boleh tukar ikut suka hati korang
*URL ANDA DI SINI : masukkan url blog korang ok?
*Tulisan Komen dan Top korang boleh tukar sendiri

Save dan siap ! :D


Credit :
Blogspot Tutorials

Kak Edriena Hazelina
Kak Ynn
Acapz

p/s : Sebenarnya link Blogspot Tutorials yang aku bagi tu ialan code yang asal. Aku ubah sikit-sikit sebab dia bagi code yang kosong. Maknanya kita sendiri kena letak code dia untuk dimasukkan dalam tab. Sebab itu aku guna tutorial Kak Edriena untuk Komen Terkini dan Top Post


*Baca dan fahami betul-betul. Jangan mudah menyerah kalah :D

You May Also Like

14 comments