Arsip Blog
Cara Membuat Menu Utama Blogspot Dengan Images
Jumat, Maret 20, 2009 // 23 komentar // Rudy // Category: Blogging Tutorial , Html , Tips dan Tricks //Assalamu'alaikum..wr..wb..!!!
Sebelumnya saya ucapkan terimakasih kepada sobat blogger, Mas Hary yang telah sudi bertanya melalui chat box tentang cara membuat menu utama seperti yang anda lihat pada menu utama blog ini. Dari pertanyaan tersbut, saya kemudian terinpirasi untuk membuat postingan tutorial tentang cara membuat menu utama dengan tampilan image sebagai tautan. Ini hanyalah trick sederhana yang saya buat hanya sekedar iseng (ga nyangka bakal ada yang simpati, hehe..). Dan untuk mempertanggung jawabkan perbuatan saya terhadap anak orang itu, maka di buatlah postingan tutorial ini (kalimatnya ko mirip sblumnya ?).
Ok !! Langsung aja, pertama-tama anda klik blogger.com, dan sign in ke dashboard → edit layout → Edit html.
Jangan lupa memakai helm untuk mem-back Up template anda sebelum di edit. Kalau sudah, tidak perlu mengklik expand template widged.
<div class='list_menu'>
<b:section id='topmenusection' maxwidgets='1' showaddelement='no'>
<b:widget id='LinkList1' locked='false' title='Top Menu' type='LinkList'/>
</b:section>
Ganti tulisan showaddelement='no menjadi showaddelement='yes
kemudian, ganti angka 1 pada tulisan maxwidgets='1 dengan angka jumlah widged yang anda inginkan muncul pada sidebar element headher.
Dan jangan lupa untuk mengganti kode true dengan false
Kalau sudah, klik simpan dan masuk ke edit layout, sekarang anda dapat menambahkan widged pada element headher. Gunakan kode di bawah ini untuk membuat menu utama :
Silakan di kopas (kopy paste) !!
<center><table border="0">
<tr>
<td><a href="URL menu pertama/"><img border="0" alt="judul menu pertama" src="URL image menu pertama"/>
</a></td>
<td><a href="URL menu kedua/"><img border="0" alt="judul menu kedua" src="URL image menu kedua
"/></a></td>
<td><a href="URL menu ketiga"><img border="0" alt="judul menu ketiga" src="URL image menu ketiga"/>
</a></td>
<td><a href="URL menu keempat"><img border="0" alt="judul menu keempat" src="URL image menu keempat"/></a></td>
</tr>
</table></center>
KETERANGAN :
sebelum :
</td>
</tr>
</table></center> :
SELESAI, SELAMAT MENCOBA !!
Jika ada yang kurang jelas, sikakan cantumkan pada kotak komentar !!
Berhubung karena kemarin pada blog ini, template beserta alamatnya sudah di up date, jdi contoh navbar yg di bhas pd artikel di atas dapat di lihat klik di sini. Mohon ma'af jika kurang berkenan..
Related posts :
23 komentar for this post
Leave a reply
Publisher
Followers
Category
2008 - 2009 SimplexDesign. Content in my blog is licensed under a Creative Commons License.- SimplexPro template designed by Simplex Design.
- Powered by Blogger.com.
This template is brought to you by : allblogtools.com | Blogger Templates
Dian Maya Kirana
Maret 24, 2009 10:05 PM
ga mudenk akuww.. mendingan tukeran link aja yak.. :)
admin
April 22, 2009 4:03 AM
bagaimana membuat top menu seperti pada blog bapak ini? Trimss ya Pak
Rudy
April 22, 2009 9:03 PM
@HUKUM: Wah, jangan manggil Pak donk, bru 1 bulan masuk 20 nih, hehe....
PostRank kale Mas, atau Top Post. Udah ada postingannya Mas..!!
Terimakasih kmbli...
NIDA EL-ADABI
Mei 07, 2009 2:50 AM
mas giman mengisi menu utama kok gak isa link
Rudy
Mei 07, 2009 8:09 AM
@NIDA EL-ADABI: Terimakasih sblumnya. Mungkin ada kesalahan pada target hypertext menu trsbut, pastikan formatnya spti ini <a href="http//URL menu">
sdangkan untk image, pastikan juga pada URL-nya berakhiran .jpg atau .gif dan sjenis file image lainnya.
Ebenezer Munthe, M.Th
Juli 20, 2009 5:18 AM
hallo....bos... aku mau minta cara mengisi menu menu di blog saya. Ajarin donk.....? sebelum dan sesudahnya aku ucapin trimakasih
Admin
Agustus 03, 2009 4:58 AM
mas tolong kasih tahu cara ngisi menu tadi dari kemarin saya coba ngisi bingung je(ALAMT EMAILNYA:jokodjogdja87@gmail.com
joko
Agustus 03, 2009 5:03 AM
mas kalau top menunya sudah jadi terus cara ngisinya postinganya bagaimana, mf saya masih awam tentang blog
email: jokodjogdja87@gmail.com
Harry Afs
Agustus 21, 2009 2:33 AM
Mas...,tutorialnya muantebb..,dan menu saya udah jadi..., Tapi cara mengisi postingan kedalam menu-menu tadi bagaimana? Udah saya otak-atik tetap aja ng' bisa.
Jadi... menu-menu saya tetap blank, ng' ada isinya. Tolong kirimin triknya ke email saya dong mas..!!! Makasih.....
email: harry_cvrt@yahoo.co.id
Anonim
September 08, 2009 6:15 PM
udah nyari banyak kali, kok gak ketemu yak, si list menu di HTML ku
dimana sih dirimu????????
donkrax
September 16, 2009 8:44 AM
makacih atas smua informasinya...........
Laptop Murah
Oktober 26, 2009 8:51 PM
Wah..pusing jadinya..
Laptop Murah, Lowongan Kerja di Bali
Antsnec
Desember 06, 2009 5:38 AM
terima kasih, atas bantuannya terima kasih!
ervin
Januari 02, 2010 9:17 AM
mas mau tanya cara mengisi postingan kedalam menu-menu tadi bagaimana? Udah saya otak-atik tetap aja ng' bisa.
Jadi...hasil postingan saya ga bisa msuk ke menu tersebut mohon pencerahannya mail saya ervin_tea@yahoo.co.id terima kasih sebelumnya
jaka
Januari 07, 2010 1:40 AM
bagus banget nih cara bikin widgeo
tyo angga alfandi
Januari 10, 2010 10:35 AM
HUUUUFT ADA YANG LEBIH MUDAH GA YA./.
Diman x Mahdim
Maret 17, 2010 4:12 AM
thank's banget tips2x....
fajricapcom
Mei 10, 2010 6:08 AM
Thank'u atas semua ilmux.........Maklum kita baru belajar
orlandolab.blogspot.com
Oktober 30, 2010 2:11 AM
Mas gimana cara mbuat menu utama yang kalau di hover muncul sub menu nya
FRIENSHIP DAN STORE ONLINE
Januari 18, 2011 1:30 AM
Trim's atas informasinya saya akan coba pada blog saya semoga kita semua menjadi para blogger yang bisa saling bekerjasama,AMIN
Santri Tuleen
Maret 13, 2011 10:04 PM
TRIMAH KASIH BOSS, ATAS INFORMASIHNYA
wayansuartawa
Mei 10, 2011 10:40 PM
Mas kode ini nggak ketemu :
ini class='list_menu'>
ini
ini
ini
dimana nyarinya ? trim banyak
Unknown
Desember 12, 2012 8:25 PM
terima kasih bg infonya..
berguna banget karena say bru membut blog..
mmpir ke blog gw
http://azadiindra.blogspot.com/