Pangeran Tinta - Car Memasang Menu Secara Vertikal pada Blog, Menu Vertikal adalah susunan menu yang di susun secara vertikal, berbeda sekali dengan menu horisontal yang biasa biasa kita jumpai, mungkin ini adalah salah satu solusi menyembunyikan widget yang terlalu banyak di halaman blog sobat. Sobat yang tertarik pasang menu accordion di blogger, silahkan ikuti langkah-lngkah sebgai berikut ini ya bro:
1. Logi ke akun blogger nd dulu di sini bro juga bisa BLOGGER
2. Klik TEmplate --> Edit HTML
3. Kemudian letakkan kode berikut di atas kode ]]></b:skin>
4. Klik save template dan kita akan menuju ke penambahan gadget.
5. Klik Rancangan --> Elemen laman--> Tambah gadget--> Pilih HTML/Javascript
6. Masukkan kode berikut ke dalam kotak yang di sediakan.
7. Klik save dan lihat hasilnya, mudah tidak bro? mudah kan? sekarang giliran anda, selamat mencoba dan semoga berhasil, jika ada yang kurang paham tolong komentar di kolom komentar di bawah ya bro. :D kalau mau tutorial lainya bisa juga kesini bro TIPS NGEBLOG,
1. Logi ke akun blogger nd dulu di sini bro juga bisa BLOGGER
2. Klik TEmplate --> Edit HTML
3. Kemudian letakkan kode berikut di atas kode ]]></b:skin>
#acc{background:#666;font:13px trebuchet ms;
line-height:1.2em;padding:10px;margin:0;}
#acc h3{background:-moz-linear-gradient(top,#ccc,#999);padding:5px 10px;margin:0;color:#222;
text-shadow:0px 1px 1px #fff;
border-bottom:2px solid #444;}
#acc h3 a{color:#555}
#acc h3 a:hover{color:#000}
#acc .post{background:#fff;color:#000;padding:10px;margin:10px 0px;display:none;
border-bottom:2px solid #222;}
#acc :target h3 + .post {display:block;height:150px;overflow:auto;}
#acc :target h3 a{color:#aa5500}
line-height:1.2em;padding:10px;margin:0;}
#acc h3{background:-moz-linear-gradient(top,#ccc,#999);padding:5px 10px;margin:0;color:#222;
text-shadow:0px 1px 1px #fff;
border-bottom:2px solid #444;}
#acc h3 a{color:#555}
#acc h3 a:hover{color:#000}
#acc .post{background:#fff;color:#000;padding:10px;margin:10px 0px;display:none;
border-bottom:2px solid #222;}
#acc :target h3 + .post {display:block;height:150px;overflow:auto;}
#acc :target h3 a{color:#aa5500}
4. Klik save template dan kita akan menuju ke penambahan gadget.
5. Klik Rancangan --> Elemen laman--> Tambah gadget--> Pilih HTML/Javascript
6. Masukkan kode berikut ke dalam kotak yang di sediakan.
<div id="acc">
<div id="isi1">
<h3><a href="#isi1">Tittle 1</a></h3>
<div class="post">
</div>
<div id="isi2">
<h3><a href="#isi2">Judul 2</a></h3>
<div class="post">
</div>
<div id="isi3">
<h3><a href="#isi3">Tittle3</a></h3>
<div class="post">
</div>
</div>
<div id="isi1">
<h3><a href="#isi1">Tittle 1</a></h3>
<div class="post">
Masukkan text atau icon anda di sini
</div></div>
<div id="isi2">
<h3><a href="#isi2">Judul 2</a></h3>
<div class="post">
Masukkan text atau icon anda di sini
</div></div>
<div id="isi3">
<h3><a href="#isi3">Tittle3</a></h3>
<div class="post">
Masukkan text atau icon anda di sini
</div></div>
</div>
7. Klik save dan lihat hasilnya, mudah tidak bro? mudah kan? sekarang giliran anda, selamat mencoba dan semoga berhasil, jika ada yang kurang paham tolong komentar di kolom komentar di bawah ya bro. :D kalau mau tutorial lainya bisa juga kesini bro TIPS NGEBLOG,