Tutorial Cara Membuat Widget Sticky Keren di Blogger - Saya akan menjelaskan sedikit tentang Sticky Sticky widget merupakan widget yang melayang jika layar akan melewati widget tersebut dan melayang mengikuti layar. Setelah layar kembali ke atas sampai ke letak awal widget, widget tidak akan ikut melayang lagi. Biasanya widget yang sticky ini diletakkan di posisi paling bawah. Aneh, jika widget ini diletakkan di posisi paling atas dari widget-widget yang lain, karena akan bentrok jika layar ke bawah. Cara membuat sticky widget ini tidak lah sulit, anda hanya perlu ramuan javascript, CSS dan HTML. Sedikit kok tutorialnya mudah-mudahan.
Screenshoot :
Java Script
Letakkan JavaScript berikut tepat di atas </body>
Letakkan CSS berikut tepat di atas ]]</b:skin>
HTML
Widget yang paling atas menjadi catcher dan anda akan membuat widget elemen baru di bawahnya. Dalam Tampilan EDIT HTML Blogger Baru, akan lebih mudah untuk membuat widget sticky ini karena <b:section> dapat dirampingkan menjadi <b:section>....</b:section>
kode HTML akan seperti ini
jika ada permasalahan silahkan komentar di bawah ini
Screenshoot :
Java Script
Letakkan JavaScript berikut tepat di atas </body>
<script src='http://yourjavascript.com/47203410510/hack4rt.us-sticky.js' type='text/javascript'/>Kalau pada template anda belum terpasang JQuery, silahkan letakkan JQuery berikut tepat di atas </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>CSS
Letakkan CSS berikut tepat di atas ]]</b:skin>
#sticky{margin-top:10px; width:300px;}Sesuaikan ukuran width dengan ukuran widget anda.
HTML
Widget yang paling atas menjadi catcher dan anda akan membuat widget elemen baru di bawahnya. Dalam Tampilan EDIT HTML Blogger Baru, akan lebih mudah untuk membuat widget sticky ini karena <b:section> dapat dirampingkan menjadi <b:section>....</b:section>
kode HTML akan seperti ini
<div id='catcher'>Dan Selesai . Selamat mencoba sobat Racara
Widget 1
</div>
<div id='sticky'>
ISI KODE WIDGET ATAU IKLAN
</div>
jika ada permasalahan silahkan komentar di bawah ini
Berlangganan : Masukan e-mail Anda untuk mendapatkan kiriman artikel terbaru dari Ali Maghfur langsung di pesan kotak masuk.
26 Komentar untuk "Tutorial Cara Membuat Widget Sticky Keren di Blogger"
keren gan, adsnya bisa ngikutin gitu. lebih besar peluang dikliknya.
iya ganterimakasih atas kunjungannya..
keren kykny tuh sob.nyimak dlu ya.
comment back ya.. :D
oke mas terimakasih atas kunjungannya..
barang contoh yang dah jadi ada ga gan? keren banget ne masalahnya
ada gan tinggal kamu scroll kebawah kelihatan iklan Google Adsense yg melayang itu contohnya..
menarik mas tutorialnya, untuk yang menggunakan iklan di blognya cocok banget kalo menggunakan widget sticky ini
iya mas ..
makasih atas kunjungannya..
tapi kasian gan kalo pake widget melayang2 gtu, bikin pusing pengunjung :D
gpp gan yang pnting engga jatuh aja..hehhehe :D
Biasanya sama orang" ditaruh widget populer post ini toh rahasianya :D hahha
iya mas silahkan di coba..hehehe
ane terkesan ama logo ente gan.. hehe.. mantab.. masalah artikelnya ane ikutan dah ya :D
hehehe.terimakasih :)
wah...bagus d coba nih..thx tutorialnya bang
komen back yeee
silahkan mass..
Keren, tapi kurang jelas sob caranya
Wah keren nih kyknya ijin nyoba bro :v
kayaknya boleh dicoba nih tutorial...
ikuti dari atas saja nanti faham kug..
moggo..
silahkan di coba bang..
Wihh Keren Gan Toturialnyaa (Y) Ditunngu Yoo Toturial Selanjutnya :)
Oh iyaa Saya Tunggu FollBacknya :D
Ini yang saya cari ... :)
monggo di coba mas..
Saya coba dulu tutornya..
Terimakasih sob