Cara memasang tab menu pada blog

Pada template blog pasti ingin di tambahkan pernak-pernik untuk menambah keindahan blog, namun bagaimana kalau tempat pemasangan gadget terbatas/tidak ingin memakan banyak tempat

Salah satu nya bisa menggunakan menu tab dimana pada satu tampilan banyak menu yang terpasang dan akan muncul sesuai judul tab yang di klick

untuk contohnya lihat pada bagian bawah blog

Untuk itu saya akan mencoba share trick memasang gadget tab menu pada template blog mobile koleksi template di blog ini, dan sebenarnya saya sudah memasang script dan css pada masing-masing template mobile sehingga tinggal memasang 1 bagian script html dengan sangat mudah (read: duh tegang banget bacanya santai atuh broth hehe)

Langsung aja ke cara pemasangannya

1. Login blog dahulu
2. Masuk rancangan/ tata letak
3. Kemudian klick tambah gadget pada gadget yang terakhir jika pada template simple blue b1 (read: kenapa harus yang paling bawah soalnya gadgetnya belum di kasih css total jadi tidak bikin berantakan soalnya tab menu sudah menggunakan css sendiri hehe)

4. Jika sudah klick tambah gadget pilih menu html/javascript unuk memasang script tab menu dan scriptnya tinggal di copy di bawah ini:



<div class='tabber'>
<div class='tabbertab' id='tab1'>
<h2>Comment</h2>

letakan tampilan 1 di sini

</div>

<div class='tabbertab' id='tab2'>
<h2 class='title'> posts </h2>

letakan tampilan 2 di sini
</div>

<div class='tabbertab' id='tab3'>
<h2>shoutmix</h2>

letakan tampilan 3 di sini

</div>

</div>




keterangan: tab menu pada contoh hanya 3 tab menu dan bisa di tambahkan dengan menggandakan script dengan angka 4,5 dst,
contoh:
<div class='tabbertab' id='tab4'>
<h2>shoutmix</h2>

letakan tampilan 4 di sini

</div>

dan letakan di tengah-tengah kode </div>
sebelum yang paling bawah

jika sudah tinggal pilih simpan dan selesai deh

silahkan di coba saja dan jika masih ada kesulitan post di commentar saja



18 komentar:

  1. wah ini dia yg saya tunggu2, udh dishare tnx gan sharenya tak jajal dulu...hehe

    ReplyDelete
  2. Semut@ silahkan broth moga sukses

    ReplyDelete
  3. sip.. Bos.. Agak bingung sih.. Hehe

    ReplyDelete
  4. Bujen@ bingung kenapa broth? Kan tinggal pasang di gadget html, dan letakan file/gambar yang mau di tampilkan pada bagian ' letakan Tampilan1' dan berikutnya broth

    ReplyDelete
  5. Akhirnya sukses jg gan, silahkan ditengok barangkali ada masukan, tnx

    ReplyDelete
  6. Semut @ oke sob nanti saya pasti mampir broth....

    ReplyDelete
  7. Rizal@ oke sob thanks commentnya....

    ReplyDelete
  8. Kang mao tnya klo buat tab menu di templat black m v2 emg warna latar belakangnya gak sesuai ma templatnya ya mas kok warnanya putih.gmn caranya nyesuaikannya mas?thanks

    ReplyDelete
  9. Maz-prie@
    iyah saya buat cssnya sama tapi bisa di rubah kok edit saja lewat template dan caranya sudah saya post di artikel cek saja langsung.

    ReplyDelete
  10. belum ngerti gan ko tampilanya kaya gini lw bisa liat blog saya di azgista.blogspot.com. gan punya apps jzipman untuk hp java yg riel

    ReplyDelete
  11. @pusat pulsa dahsyat memang begitu pland tampilannya memang bingung di mananya?
    Kalau itu setelah tidak perlu url langsung isi text/gambar di tiap tab id nya..

    ReplyDelete
  12. Ass...
    Gan kalo black mobil menu y di atas bisa di rubah g?
    Bagaimana cara nya?

    ReplyDelete
  13. @Raszhoe di rubah menunya gimana? Tampilan Cssnya ataukau menunya?

    ReplyDelete
  14. kang bagas kumaha euy abdi teu paham......

    ReplyDelete
  15. @bojes gothic copy kode di atas terus ke tambah gadget dan pilih javascript/html , kemudian pasang script di atas untuk memasang tab, dan untuk tulisan tampilan 1 ganti dngan script/tulisan yg mau di tampilkan begitu selanjunya dngan tampilan 2 dan 3 tinggal edit aja.

    ReplyDelete

MOHON DI BACA
Semoga anda adalah pembaca yang baik hati jika berkenan tinggalkanlah komentar untuk saya

1. Gunakan pilih nama/url pada pemilihan nama jika anda tidak memiliki blog
2. Sebisa mungkin jangan menggunakan id anonim atau id falsu
3. Di mohon komentar tidak mengandung sara, saru, spam dan kata-kata yang tidak pantas di ucapkan
4. Jika komentar tidak pantas di tampilkan admin akan menghapus komentar yang sudah ada.
5. Komentar anda merupakan motipasi bagi kelangsungan blog ini.

About blog | Feedback | Rss
Copyright 2009 - 2012 Hak cipta di lindungi UUD
Naik