Thursday, June 7, 2012

Cara membuat gambar melayang dengan link

Pada kesempatan sebelmnya start-xp juga pernah membahas tentang cara membuat gambar melayang di blog, namun kali ini start-xp akan sedikit menambah fiturnya, yaitu membuat gambar melayang dengan link didalamnya..

berikut langkha-langkahnya :

1. Login ke blogger, Dasbor pergi ke Rancangan lalu Edit HTML.

2. Centang Expand Template Widget.

3. Download dulu template sobat supaya aman jika terjadi kesalahn dalam pengeditan.

4.  Cari kode : ]]></b:skin>, untuk mempermudah tekan ctrl+F\

5.  Letakkan kode dibawah ini diatas kode ]]></b:skin>


#trik_pojok {
position:fixed;_position:absolute;
bottom:0px; left:0px;
clip:inherit;
_top:expressionundefineddocument.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expressionundefineddocument.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

6. Text yang berwarna biru adalah pengaturan posisi,sobat bisa ganti di posisi pojok kanan bawah tinggal text "left" diganti dengan "right" atau juga tengan dengan "center". Begitu juga tulisan "bottom", jika pengen di posisi atas bisa diganti dengan "top". Dan yang berwarna merah adalah jarang dengan posisi blog sobat. 

7. Langkah selanjutnya yaitu letekkan script dibawah ini sebelum kode </body>

<div id="trik_pojok">
<a href="
http://www.software4kita.com/">
<img src="
http://i1212.photobucket.com/albums/cc459/engcellpulsa/20070717193729_burung_469cb8091c4f5.gif" border="0" /></a>
</div>


8. Kode yang berwarna biru bisa sobat ganti dengan link yang ingin sobat start-xp masukkan dan yang berwarna merah diganti dengan foto atau gambar/banner yang sobatakan ditaruh di pojok blog sobat

9. Save dan lihat hasilnya

sekian trik blogger kali ini, semoga bermanfaat untuk sobat start-xp semua :)




No comments:

Post a Comment