Indonesia Vs Malaysia We Are One Forever
Info penerimaan mahasiswa baru IDIA Prenduan tahun akademik 2010-2011 silahkan klik di sini
Ya Allah Jangan Kau Coba Aku Melebihi Batas Mampu Dan Sanggupku

Membuat Tab Navigasi Blog

Minggu, 19 Juni 2011

Kirim ini ke Facebook Anda..

www.tips-fb.com

Salam sahabat, izinkan tc tuk berbagi bersama sobat, dalam kali ini tc akan pandu sobat untuk membuat TAB NAVIGATION, gambar di bawah adalah contohnya

nah bila sobat berminat membuat tab ini silahkan sobat ikuti langkah-langkah penyelesaiannya ok..

  1. Login di blog sobat
  2. Kemudian pilih TATA LETAK
  3. Klik EDIT HTML
  4. Masukkan kode dibawah ini tepat di atas kode ]]></b:skin>
    .glossymenu{ position: relative; padding: 0 0 0 34px; margin: 0 auto 0 auto; background: url(http://i730.photobucket.com/albums/ww306/gozhilaq/Menu-background-1.gif) repeat-x; /*tab background image path*/ height: 46px; list-style: none; } .glossymenu li{ float:left; } .glossymenu li a{ float: left; display: block; color:#000; text-decoration: none; font-family: sans-serif; font-size: 11px; font-weight: bold; padding:0 0 0 16px; /*Jangan Dirubah kode Jarak ini*/ height: 46px; line-height: 46px; text-align: center; cursor: pointer; } .glossymenu li a b{ float: left; display: block; padding: 0 20px 0 8px; } .glossymenu li.current a, .glossymenu li a:hover{ color: #fff; background: url(http://i730.photobucket.com/albums/ww306/gozhilaq/Menu-kiri.gif) no-repeat; background-position: left; } .glossymenu li.current a b, .glossymenu li a:hover b{ color: #fff; background: url(http://i730.photobucket.com/albums/ww306/gozhilaq/Menu-kanan.gif) no-repeat right top; }
  5. Kemudian masukkan kode dibawah ini diatas kode <div id='content-wrapper'>
    <ul class='glossymenu'> <li class='current'><a href='URL-Blog-Kamu'>Home</a></li>
    <li><a href='URL-Link-Tujuan1'>EDIT 1</a></li>
    <li><a href='URL-Link-Tujuan1'>EDIT 2</a></li>
    <li><a href='URL-Link-Tujuan1'>EDIT 3</a></li>
    <li><a href='URL-Link-Tujuan1'>EDIT 4</a></li>
    <li><a href='URL-Link-Tujuan1'>EDIT 5</a></li>
    <li><a href='URL-Link-Tujuan1'>EDIT 6</a></li>
    <li><a href='URL-Link-Tujuan1'>EDIT 7</a></li>
    </ul>
NB:..
  • Ganti kode berwarna Merah dengan URL Alamat Link Tujuan Anda
  • Ganti kode berwarna Kuninga dengan Judul Dari Link Tujuan Anda

Artikel Terkait



33 komentar:

Ica mengatakan...

Sip.. dibookmark dulu ya.... ntar mau coba2 deh.
Thanks ya sob :)

2012 mengatakan...

wah,,,, seep mas!! bisa diterapin jga ke blog ane!
Keep it up your post!

Ilham Nurhamzah mengatakan...

ma kasih mas atas infonya

modjo mengatakan...

thanks infonya, tp blm mo nyoba...

dogancengkir mengatakan...

makasih ya sob,,, saya dah make sob, tapi saya dah mengunakan tapi hasilnya kurang memauskan,,, saya mau coba yang ini ya sob,,, sukses buat kamu

Aryo Halim mengatakan...

terima kasih infonya, cuma blog ku loadingnya sudah berat jadi cukup segitu saja dulu deh

secangkir teh dan sekera roti mengatakan...

jvscrip ato css?

defchania mengatakan...

sip.. infony sob..
thanks dah brkunjung N follow,
entr dcoba follow,
maklum sob.. cuma ol pki hp,
jngn klu mau follow harus ganti browser dulu..
met istrht y

Syifa Aulia (Kak Cipa) mengatakan...

iiiih menarikk...

Kampung inggris Pare mengatakan...

woyyyyyyyyyyyyyyyy

heru mengatakan...

terima kasih sobat tutorialnya, salam sukses

Ezha_cuTe mengatakan...

nah ini yang di cari2...baru ketemu,,,tar di cobain deh ke tekape...ckakak...thx buat sharingnya y sob :)
jangan lupa kunjung balik oke...?

anak nelayan mengatakan...

kerenn tutornya boss..thx

tukang edit mengatakan...

mantebs mas artikelnya...saya bookmark neh..

asep canda mengatakan...

makasih atas infonya sob sukses selalu ya

erwin-retta.blogspot.com mengatakan...

buat merubah warnanya gmn bro?

mas bayu mengatakan...

artikel nya disini semua berguna banget buat teman2 bloger teruskan sob buat eksperimenya

Nanang mengatakan...

Nice tips...

Unknown mengatakan...

trimakasih, kunjungan balik..

http://trojandecoder.blogspot.com/

Arbitter mengatakan...

Asalamualaikum info tips dan trick yang bagus....oh iya..sebuah undangan, undangan nih bro dari Arbitter forum Blogger skalian meramaikan blogger forum dan bisa link back gratis setelah postingan.bayak blogger yang sudah bergabung dan bisa berinteraksi serta memposting beberapa artikel mengenai blogging dan teknik blogging...

btw aku dah follow blog ini follow back ya...

iyem mengatakan...

nice inpoh....

tukeran link yak.....

http://ctzahra.wordpress.com

Enry Mazni mengatakan...

nice tip..udah lama nyari yang ginian...hehehe thanx ya mas

Asri ali gur mengatakan...

terima kasih yeap....

ajurNA mengatakan...

Lumayan... dapat ilmu baru lagi...

Andilaceh mengatakan...

makasih...atas info ny

Andilaceh mengatakan...

dah lama nyarik huuuu...baru dapet....

hehehe jagan lupa singah di blog.andilaceh

aulia mengatakan...

di template saya ga ada kode 'content-wrapper' terus taruh dmn yaaa,thanks

Ladida mengatakan...

saya bolak balik eksperimen ngga pernah bisa d blog saya yg lain . ,

tp semoga ini berhasil . , ^_^

makasii infonya !!

ariewayq mengatakan...

makasi mas,
tapi subnya tidak ada.
yang ada tab nya aja...tapi tetap keren,

YOGYAKARTA mengatakan...

wow this really good blog content

Bersama Dakwah Islam mengatakan...

banyak ilmu dan wawasan yang saya dapatkan disini, terimakasih dan salam ukhuwah wahai sauadaraku.

moto 9 mengatakan...

nice artikel, saya akan coba buat Tab Navigasi Blog, salam blogger
http://www.moto9.us

fadhil mengatakan...

dak biso2 ku cubo.. bantu lah.


Profil lengkap


HELO SOBAT BLOGGER MAMPIR SINI YACH..Hp:087850265023 KEPADA SEGENAP PENGUNJUNG SAYA UCAPKAN TERIMA KASIH SUDAH MENGISI ABSEN HADIR DISNI, DAN MOHON MAAF JIKA SAYA TERLAMBAT MEMBALAS KUNJUNGAN ANDA....
Sekalian follow yach!! i will follow u back ok??