Tutorial : Cara Buat Auto Hide Menu.

Tutorial Time !

Tutorial ni adalah request dari blogger Faraa, thankx sebab sudi tanya kalau tak aku pun tak tahu nak bagi tutorial apa : )

Nak buat menu autohide macam ni ? Jom !

Tutorial ni akan menampakkan sidebar korang lebih kemas, tanpa banyak kacau, malah blog loading pun jadi lebih ringan !  Tutorial yang aku punya ni adalah link menu autohide tanpa border ye.

Langkah 1

Cara Buat Menu Auto Slide : 

• Go to >> Edit Html >> Download Full Templates (sebagai backup template korang) >> Tandakan Expands Widget Template

• Ctrl F dan cari perkataan 

</head>

• Copy kod dibawah & letak di atas kod </head> tadi 

<style type="text/css">

.texthidden {display:inline}

.shown {display:block}

</style>

<script type="text/javascript">

document.write('<style>.texthidden {display:none} </style>');

</script>

<script type="text/Javascript">

function expandcollapse (postid) {

whichpost = document.getElementById(postid);

if (whichpost.className=="shown") {

whichpost.className="texthidden";

}

else {

whichpost.className="shown";

}

}

</script>

• Ok, save template.

Langkah 2

Cara Buat Menu Auto Slide : 

• Go to >> Page Element >> Add a gadget >> Html / Javascript
• Copy & Paste kod berikut : 

<ul><a href="javascript:void(0);" onclick="expandcollapse('keyword')"> <h4>[+/-] PESANAN SILAMPUNEON</h4></a></ul>
<ul class="texthidden" id="keyword">
<center>* KORANG BOLEH LETAK WORD,WIDGET YANG KORANG SUKA KAT DALAM AUTO HIDE MENU NI.SELAMAT MENCUBA *</center>
 *</center>
</ul>

<ul><a href="javascript:void(0);" onclick="expandcollapse('button')"> <h4>[+/-] CREDIT </h4></a></ul>
<ul class="texthidden" id="button">
<center>* COPY CATS ARE ALLOWES HERE. PLS CREDIT SOME BACKLINKS TQVM*</center>
*</center>
</ul>

• Edit perkataan warna merah. Perkataan warna merah ni mesti sama, kalau tak autoslide menu takkan berfungsi. Perkataan warna merah ni jugak tak digalakkan kalau korang letak nombor, guna perkataan je ok.

• Edit perkataan warna oren dengan tajuk menu korang.

• Edit perkataan warna biru dengan perkataan, code, widget, gambar atau apa sahaja yang korang nak ada dalam auto hide menu ni. 

• Save dan view blog korang.

Kalau nak buat border atau frame pada menu autohide pun boleh gak. Kalau nak buat yang ade border, boleh la rujuk kat Blogger Tom ni, ya : )

Selamat Maju Jaya !




Feeling Lucky?