Tutorial : Menu Tab di Sidebar

Hi tengah malam ni Anna nak share satu tuto lagi. Act akak Nao Mei ade tanya Anna macam mane nak buat  Tab Menu kat Sidebar. So i hve found this tuto and credit to : Fara :)

This picture Credit to : Fara :)

Akak , betul ke yang macam ni ? Anna harap betul laa yea ? Heheh :)

So jom follow tuto bawah ni :-

1. Go to Layout  >  Add a Gadjet  >  HTML/Java Script Box

2. Then copy code kat bawah ni n paste kan kat kotak HTML tadi .

<style>.kotak navigation {text-align:left;width:290px;color:#333333}a.navigation {cursor:vertical-text;background-image:url(URL BACKGROUND);width:75px;text-decoration:none;color:#333333;display:inline-block;border:2px outset #cecece;text-align:center;font:14px Yanone Kaffeesatz;letter-spacing:2px;-webkit-transition-duration:0.5s;}a.navigation:hover {border:2px ridge #cecece;background-image:url(URL BACKGROUND);background-position:50% 80%;background-size:400px;color:#fff;-webkit-transition-duration:0.5s;}#fh img { max-width:260px;} </style><center><div class="kotaknavigation"><a class="navigation" onclick="document.getElementById('fh').innerHTML=document.getElementById('a').innerHTML" >TAB1</a><a class="navigation" onclick="document.getElementById('fh').innerHTML=document.getElementById('b').innerHTML" >TAB2</a><a class="navigation" onclick="document.getElementById('fh').innerHTML=document.getElementById('c').innerHTML" >TAB3</a></div></center><div id="fh" style="width:270px;color:#333333;font:12px verdana;"><br />ISI FRONT PAGE (SEBELUM tab 1 and etc)</div><div id="a" style="display: none;">ISI UNTUK TAB1</div><div id="b" style="display: none;">ISI UNTUK TAB2</div><div id="c" style="display: none;">ISI UNTUK TAB3</div>

3. Last Save ! 

*  Boleh ubah sendiri maklumat yang diperlukan macam URL BACKGROUND , CODE WARNA tu yea :)

* CODE WARNA DI SINI !

Tweet

---

- Thanks for Reading . Do Like and Comment :) -

---