- Login ke blogger
- masuk ke rancangan
- tambah gadget
- pilih Html Java Script masuk kan kode script di bawah ini lalu simpan dan lihat hasil nya
<div style="background: url(http://www.animateit.net/data/media/august2009/twi.gif
) no-repeat;
color:#000;border: 1px solid#000;
height: auto; width: 250px;
height: auto; width: 250px;
padding:10px 10px 10px 10px;
-moz-border-radius-topright:10px;
-webkit-border-top-right-radius:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-bottom-right-radius:10px;
-moz-border-radius-topleft:10px;
-webkit-border-top-left-radius:10px;
-moz-border-radius-bottomleft:10px;
-webkit-border-bottom-left-radius:10px;
-webkit-box-shadow: 2px 2px 4px #8bd268;
-moz-box-shadow: 2px 2px 4px #8bd268;">
<style>.list {
background: url("http://i1136.photobucket.com/albums/n499/Mahfid_Mayanto/panah-jalan.gif") no-repeat left center;border-bottom:1px dotted #ddd;line-height:1.2em;padding:3px 0px 0px 20px;
}
</style>
<div class="list">
<a href="#" class="nudge">judul isi postingan</a> </div>
<div class="list">
<a href="#" class="nudge">judul isi postingan</a> </div>
<div class="list">
<a href="#" class="nudge">judul isi postingan</a> </div>
<div class="list">
<a href="#" class="nudge">judul isi postingan</a> </div>
<div class="list">
<a href="#" class="nudge">judul isi postingan</a> </div>
<div class="list">
<a href="#" class="nudge">judul isi postingan</a> </div>
<div class="list">
<a href="#" class="nudge">judul isi postingan</a> </div>
<div class="list">
<a href="#" class="nudge">judul isi postingan</a> </div>
<div class="list">
<a href="#" class="nudge">judul isi postingan</a> </div></div>
Jika porcobaan kalian berhasil maka menu super keren nya seperti contoh di bawah ini:
Ganti teks yang berwarna merah dengan alamat Url yang kalian inginkan (untuk percobaan pake aja yang ini)
ganti tanda # dengan link yang di tuju...... selamat mencoba dan mengembang kan nya ......
No comments:
Post a Comment