Cara Memasang Menu Accordion di Blog

Cara Memasang Menu Accordion di Blog - Cara Memasang, Membuat atau Membikin Menu Accordion di Blogspot ini adalah re-post dari posting lawas saya yang berjudul cara membuat menu accordion blogger yang nggak masuk ke hatinya om gugel. Karna itu diharapkan mudah - mudahan dengan Re-post ( posting ulang ) ini, artikel saya yang telah saya hapus tersebut bisa terindeks lagi meskipun dengan URL yang berbeda.

Menu Accordion adalah berupa susunan menu yang di susun secara vertikal, tentulah berbeda sekali dengan menu horisontal ( baca : cara membuat menu horisontal di blog )yang biasa sobat 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 tutorial berikut.

1. Logi ke akun blog sobat.
2. Klik rancangan --> 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}

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">Judul 1</a></h3>
<div class="post">
Masukkan item anda disini,bisa berupa teks atau widget
</div>
</div>
<div id="isi2">
<h3><a href="#isi2">Judul 2</a></h3>
<div class="post">
Masukkan item anda disini,bisa berupa teks atau widget
</div>
</div>
<div id="isi3">
<h3><a href="#isi3">Judul 3</a></h3>
<div class="post">
Masukkan item anda disini,bisa berupa teks atau widget
</div>
</div>
</div>

7. Klik save dan lihat hasilnya... Gimana?? sederhana dan mudah bukan??

Ditulis Oleh : christian angkouw ~ Cara Bikin Blog

Christian angkouw Sobat sedang membaca artikel tentang Cara Memasang Menu Accordion di Blog. Oleh Admin, Sobat diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya

:: Get this widget ! ::

57 comments

mantap sob tp sayang gk ada demox.., saran sy bikin lg link khusus tuk demo., :)

07:10:00

Makasih gan infonya,

@Rohis FacebookOk sob... diterima sarannya... entar ane bikin.....

makasih ya!!!

08:16:00

terima kasih backlinknya

makasih sob..tar ane coba

terimakasih banyak atas tutorialnya gan

Itu warnanye kagak bisa di ganti gan ?

bagussss tapi kurang yah

Lagi nyari accordion for blogger eh nyasar ke sini :)

bos mana artikel terbarunya?

saya sering berkunjung di blog-blog, postingan ini sangat menarik serta enak dibaca.... saya berharap bisa berkunjung lagi

terima kasih banyak untuk berbagi informasi ... Semoga Tuhan memberikan yang terbaik buat Kita Semua

http://cherryliarasanty.blogspot.com

kl bikin daftar isi gmn ya bro

hebat gan,tq infonya

Mantab bro infonya,tq

terima kasih sharingnya...ini memang yang saya cari-cari... :)

Langsung di test gan,tq

makasih gan. sya sangta terbantu

02:56:00

mksih sob infonya.. menarik jga nih tak coba yhh?? linkbacknya yahh....

13:45:00

makasih y gan info nya,,,,ane jd banyak belajar,,,kpn2 mampir y ke gubuk ane "toinkzz.blogspot.com"

23:00:00

cara mengganti warna accordionnya bagaimana caranya gan?? bir cocok sama warna blog saya gan
ni blog saya gan http://webnewswithin.blogspot.com
thanks

maksud dari "widget" cara memasukkannya gimana ya Om?

Ccd pagerank palsu dipamerin

03:59:00

Kyknya udah gk work lagi ya! Border menu nya gk muncul!

makasih atas ilmunya dan salam kenal aza mas

infonya keren baget

Kunjung balik ke http://rizaladitiyosupendi.blogspot.com/

bisa dicoba nh gan kunjungan agan saya tunggu www.naufalthedarkness.blogspot.com

Sederhana tapi sangat bermanfaat,sob..

ini dia info yg saya cari..langsung praktekkin ah

01:06:00

nice

Artikelnya sangat bermanfaat fren untuk saya orang baru didunia blogger,tapi kadang-kadang masih ada istilah2 yang saya tidak mengerti.
Misalnya istiilah "rancangan" diblogspot ditulisnya apa? Saya cari tidak ketemu.Terimakasih

Thaks sobat

22:17:00

mantap mas..

Bagus banget...pengen pasang juga

terima kasih mas infonya

makasih bang infonya

Anonymous
09:42:00

Thanks Infonya, bermanfaat banget.......mau langsung praktekin nih.

Keren menu accordion nya bro! THANKS :)

02:21:00

kunjung balik bro www.ratnetworkww.blospot.com

.
Thankz sob...
corry ya..
ane msh pemula..
klo ad yg ane bikin/copas punya sob...
maaf ya...
hehehe

mantap gan infonya :)

kunjung balik + follow blog sya yahh

www.novandiehard19.blogspot.com

bagus sekali triknya gan, tidak membuat pusing kepala , Terimakasih atas artikelnya gan. salam kenal dan salam blogger

Infonya sangat membantu sekali Gan, ijin selancar di blog Anda lebih lanjut.

22:59:00

makasih ya sob.. sangat bermanfaat :)

terima kasih gan infonya semoga bermanfaat bagi orang lain

nice artikel bang !

01:21:00

tutornya keren gan, makasih

thanks-infonya
aku-sukses-gan

nice-info

Keren sob... ini yang dicari cari dari kemarin... kebetulan ane juga mosting tentang tutorial sob... mungkin sekiranya kita bisa saling berbagi... ini blog ane:

Cara Mudah Membuat Animasi Gif Cantik | Akhbar Islam

terima-kasih-atas-informasinya

saya masih bingung nyari ]]> nya
jadi saya bingung mau paste code dimana ..

mohon pencerahannya gan ?? :(

sukses brow mkasih atas infonya

Poskan Komentar

Silahkan tinggalkan komentar sobat dan dapatkan backlink satu arah langsung ke blog sobat dengan widget top komentator yang saya pasang di sidebar blog ini. Caranya dengan menjadi pemberi komentar terbanyak di blog ini, tapi mohon jangan Nyepam ya..! Komentar dengan menyertakan LINK / ANCHOR TEXT atau promosi produk tertentu akan saya hapus karena blog ini bukan tempat untuk mempromosikan produk yang dijual di blog anda.