0

Cara Menambahkan Menu Vertikal Pada Blog

Sudah lama saya tidak buka blog ini dan posting tentang tips blogger di blogger saya ini. Setelah banyak belajar buat Ujian Nasional, kali saya mau posting "Cara membuat menu vertikal dengan icon" menu ini cukup menarik kawan karena ada sebuah gambar kecil atau biasanya disebut icon kawan, menu yang menggunakan icon ini setahu saya seperti milik Yahoo! kawan tapi saya ngak tahu juga kok saya kan bukan orang pintar jadi ngak tahu apa-apa. Nah, dari pada ribet-ribet saya ngomong dan anda terlalu lama di sini lebih baik saya langsung jelaskan cara membuatnya kawan ikuti saja cara berikut ini kawan.

Cara membuat menu vertikal dengan icon
1. Login ke blogger 
2. Pilih Rancangan   
3. Klik Tambah Gadget
4. Pilih HTML/JavaScript
5. Masukan kode HTML berikut ini




<ul><table width="100%" border="0">
<tr>
<td width="3%"><div align="center"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0MBdU-KKg0bBQZ6v5C1-iycpN2o55uZw39nm_F7w3SDmFkEdUSy6tc5jMS8Dopmo1X45XQUAYXTTNdKSt5CA5jcESCscI8Pu4n-UDU8nuVb0aZ0cLYhGA7fJsvrjplAhKlyMdWsa_KzxA/s1600/report_magnify.png" width="18" height="18" /></div></td>
<td width="97%"><li><a href="http://ini-hanya-blog.blogspot.com/2011/04/daftar-isi_28.html">Daftar Isi</a></li></td>
</tr>

<tr>
<td width="3%"><div align="center"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMU9VCC57V-XpzAaM7XBsLiIeFuVWTcETmDAaKgjRa5hW7PSWrukC5wkxxD8osxJ8L_hYr2tdZj1Du_V4d7480sDAom960JEpwkRQ0xmBTTiCJzp8Y3Rm5oTrrhBsnso-tcrQPLe554W4J/" width="18" height="18" /></div></td>
<td width="97%"><li><a href="http://ini-hanya-blog.blogspot.com">Blogger</a></li></td>
</tr>

<tr>
<td><div align="center"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0SQ_XNJQFoC9wA3BoayeQudVfSuGrbrXJ8pedJ4roIvgSqg23gl8qqCz-913O3_zEuuk41grG8B9jA1rY_4NQnd5h2Aq7nQS8w8ts4C8YnE5Hbj6buIxUoeIPK1th7sVDCqF4HcLwcvZj/" width="18" height="18" /></div></td>
<td><li><a href="https://login.yahoo.com/config/login">Mail</a></li></td>
</tr>

<tr>
<td><div align="center"><img src="http://png.findicons.com/files/icons/2052/social_network/16/facebook.png" width="18" height="18" /></div></td>
<td><li><a href="http://www.facebook.com/fadhil.corbin">Facebook</a></li></td>
</tr>

<tr>
<td><div align="center"><img src="http://www.kubepublishing.com/~ifound/kubepublishing.com/images/Twitter logo_1.jpg" width="18" height="18" /></div></td>
<td><li><a href="http://twitter.com/Fadhilcorbin">Twitter</a></li></td>
</tr>

<tr>
<td width="3%"><div align="center"><img src="http://th676.photobucket.com/albums/vv124/rjalameda/th_friendster-logo.png" width="18" height="18" /></div></td>
<td width="97%"><li><a href="http://www.friendster.com/fadhilcorbin">Friendster</a></li></td>
</tr>

<tr>
<td><div align="center"><img src="http://adikristanto.net/wp-content/uploads/2010/12/plurk_logo.png" width="18" height="18" /></div></td>
<td><li><a href="http://www.plurk.com/Fadhilcorbin">Plurk</a></li></td>
</tr>

<tr>
<td><div align="center"><img src="http://www.hiddeninthesand.com/images/design_files/formspring_logo_icon.png" width="18" height="18" /></div></td>
<td><li><a href="http://formspring.me/Fadhilcorbin">Formspring</a></li></td>
</tr>

<tr>
<td><div align="center"><img src="http://koprol.zenfs.com/system/mugshots/0329/8852/koprol_logo_thumb.jpg" width="18" height="18" /></div></td>
<td><li><a href="http://koprol.com/#/users/fadhilcorbin">Koprol</a></li></td>
</tr>

<tr>
<td><div align="center"><img src="http://managementattitude4success.com/images/yahoo-logo_50.png" width="18" height="18" /></div></td>
<td><li><a href="http://www.yahoo.com">Yahoo</a></li></td>
</tr>

<tr>
<td><div align="center"><img src="http://static.wix.com/media/be6da8000853c26c868f6970f3ac941f.wix_mp" width="18" height="18" /></div></td>
<td><li><a href="http://www.4shared.com/dir/pcCkq-CJ/_online.html">4shared</a></li></td>
</tr>

<tr>
<td><div align="center"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYaEBuulp5UFRsDMuvRC8qFMbzHxPOv6c16NYrezTd7EupTS03o44hlZxLKhWI4b7tumCBGt2u4GHCr6W0JnLfAIlI6zhXL58On68oozdhMFUkpZFXa3rX5bjP9GgZ16FLmJTImNvR0_KV/s1600/google_youtube.png" width="18" height="18" /></div></td>
<td><li><a href="http://www.youtube.com/user/fadhilamadan">Youtube</a></li></td>
</tr>

<tr>
<td><div align="center"><img src="http://pusatdata.jatimprov.go.id/kabkota/pusdalip-tulungagung/css/icon/MySpace_48x48.png" width="18" height="18" /></div></td>
<td><li><a href="http://www.myspace.com/534350134">Myspace</a></li></td>
</tr>

<tr>
<td><div align="center"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuNOS-72ezCCHHzKXXHJ3fQjnSmo2scRwxlFl8MmSOIlHwpR2HJAJp0BA343y6Vy1EMZUTvGr5Kd3CDAEXAoy7yzM-Q7PFBSMFrM8p_aPMMDe3MQsgcgN3ZsMRRAOw7OAfkS29_VZvuex7/s1600/tv.png" width="18" height="18" /></div></td>
<td><li><a href="http://ini-hanya-blog.blogspot.com/2011/04/nonton-tv-online-tv-one.html">Tv </a></li></td>
</tr>

<tr>
<td><div align="center"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhz_iSe3y2ZM8jG3kwc62LGh44IrZVCrdzA6c9gfSjQWbhQsyesL7xjfEPOQ4p4vx-2t1wquMZZUO8TB_PEEczD7-gZLaHkU38nSz_3CtgXJDJW2cOW7HGdhc8_t27gZ8UzhhSIYVxBv7rV/s1600/people_online.png" width="18" height="18" /></div></td>
<td><li><a href="http://ini-hanya-blog.blogspot.com/2011/04/chatting-room.html">User Online</a></li></td>
</tr>
</table>
</ul>


6. Simpan jika sudah selesai
Catatan :
=> Untuk mengganti link silakan ganti tulisan yang berwarna merah
=> Untuk mengganti nama menu silahkan ganti tulisan yang berwarna biru

Unknown

sedang dalam perbaikan....

Tidak ada komentar:

Posting Komentar