Cara Membuat Widget Berhenti Saat Di Scroll Ke Bawah

Tips bagaimana caranya agar widget berhenti saat discroll kebawah, suatu hal yang sangat bermanfaat bagi para pemasang iklan agar informasinya mendapat perhatian khusus

Cara membuat widget berhenti saat discroll kebawah

Widget merupakan elemen yang sangat penting dalam suatu blog. Fungsi widget sangat banyak sekali dan bermacam-macam bentuknya. Widget biasanya terletak disamping postingan biasa disebut dengan sidebar dan terletak dibawah postingan biasa disebut dengan footer widget. Widget merupakan elemen yang banyak fungsinya, salah satunya sebagai tempat informasi pemilik, tombol berbagi, dan tempat menampilkan iklan. Sebagian bloger sering memanfaatkan widget di samping postingan sebagai ajang iklan pada blog mereka.

Widget dengan informasi khusus pastinya harus kita letakkan pada tempat yang kebanyakan orang pasti melihatnya, cara ini disesuaikan agar informasi yang terdapat pada widget mendapat perhatian khusus bagi pembaca blog kita. Agar widget bisa bekerja maksimal pastinya harus ada yang kita lakukan dengan widget tersebut supaya memberikan dampak positif terhadap informasi yang kita berikan.

Artikel kali ini akan membahas bagaimana cara membuat widget berhenti saat di scroll ke bawah. Manfaatnya adalah supaya widget yang kita tampilkan berhenti dan dapat dibaca sepenuhnya oleh pengunjung blog sobat. Caranya tidak behitu sulit, untuk lebih jelasnya mari kita pahami langkah-langkah berikut ini :

Step 1. Login ke blog sobat

Step 2. Masuk ke menu Tamplate dan cari kode </ body>

Step 3. Copy dan Pastekan code script ini di atas code </ body>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<SCRIPT>
$(document).ready(function() {
var div = $('#YOUR_WIDGET_ID');
var start = $(div).offset().top;
$.event.add(window, "scroll", function() {
var p = $(window).scrollTop();
$(div).css('position',((p)>start) ? 'fixed' : 'static');
$(div).css('top',((p)>start) ? '0px' : '');
});
});
</SCRIPT>

Step 4. Ubahlah tulisan merah sesuai Widget ID, ID Header-Wrapper, atau Footer-Wrapper, dll.
misalnya HTML10, Popular Post (kode widget)

Step 5. Save Tamplate dan Lihat hasilnya

Sekedar saran agar sebaiknya widget yang akan dipasang merupakan widget yang terakhir pada settingan sidebar pada Tata Letak agar informasi widget yang selanjutnya bisa terlihat saat discroll.

Baca Juga Artikel : Tips Membuat Widget Iklan Melayang di Samping Blog

Silahkan ungkap kreasimu, semoga berhasil dan tetap semangat.

COMMENTS

BLOGGER: 1
Loading...
Name

#BeMoreProductive,1,6th Indonesian Pearl Festival 2016,1,Abutours.com,1,Adobe Premier Pro,1,Asusintel,1,Award,1,Babasal Mombasa,1,Backsound,2,Balancing,1,Bangga di Banggai,1,Be Gravitasi,1,Bebas Bayar,1,Bengkel Mobil,1,Bika Bogor,1,Bika Bogor Talubi,1,Biznis,1,Blog Design,18,Blogger,24,Bumper,1,CC 2015,1,Citra Maja Raya,1,Co-working Space,1,Colidan,1,Competition,32,Competition DEV+,1,Corel Draw X7,1,Coreldraw,1,CV Design,1,Cyko Handbreak,1,dealoka,1,Designer,5,Digital Marketing,1,Domain,1,Dotcomforme.com,1,DUMET School,1,Education,6,Ekspresikan Dirimu,1,Elevenia,1,Excite Shop,1,FestHAM2016,1,Fintech,1,Footer,1,FSB,1,Goverment PR,1,HAnavi,1,Header,6,Himawan Putra,1,HIS Travel Indonesia,1,Hosting,1,hostinger,1,HRIS Software,1,Indramayu Kota Budaya,1,Influenzer,31,Inspirasi Astra,1,JIBB,1,Kuliner Bogor,1,Kursus Editing Video,1,Lawan Neuropati,1,LinovHR,1,Luna Smartphone,1,Main Post,3,Marketz,3,Meeting Room,1,Milkshake,1,Motion Graphic,2,Neurobion,1,Neuropati,1,Niagahoster,1,Obat maag paling ampuh,1,Office Room,1,Oleh-oleh Bogor,1,Oleh-oleh Khas Bogor,1,Paket Meeting,1,Pesona Jawa Tengah,1,Pop Ice,1,Ralali.com,2,Review,29,Ruang Kantor,1,Ruang Meeting,1,rukamen,1,Serumah.com,1,sewa apartemen,1,Shop n Drive,2,Sidebar,8,Skyscanner,1,Software,3,Sound Effect,2,Sponsor,14,Spooring,1,Storylio,1,Tempat Kursus Digital Marketing,1,Tips Blogging,3,Tips Design,3,Travel,8,Traveloka,2,Tutorial Blog,1,Tutorial Motion,1,Vector,1,Video Editor,5,Video Effect,1,Visit Tidore Island,1,XWORK,1,Youtuber,6,
ltr
item
Artadhitive | Daily Content Creator: Cara Membuat Widget Berhenti Saat Di Scroll Ke Bawah
Cara Membuat Widget Berhenti Saat Di Scroll Ke Bawah
Tips bagaimana caranya agar widget berhenti saat discroll kebawah, suatu hal yang sangat bermanfaat bagi para pemasang iklan agar informasinya mendapat perhatian khusus
https://4.bp.blogspot.com/-a4Ey23tWpSY/V3lOc5fT9WI/AAAAAAAAEtM/MFrWokUpPHA_hh1yRkvOZs0tQPvC3ELBQCLcB/s1600/Blog%2B12.png
https://4.bp.blogspot.com/-a4Ey23tWpSY/V3lOc5fT9WI/AAAAAAAAEtM/MFrWokUpPHA_hh1yRkvOZs0tQPvC3ELBQCLcB/s72-c/Blog%2B12.png
Artadhitive | Daily Content Creator
http://www.artadhitive.com/2016/07/Design-Blog-Cara-Membuat-Widget-Berhenti-Saat-Di-Scroll-Ke-Bawah.html
http://www.artadhitive.com/
http://www.artadhitive.com/
http://www.artadhitive.com/2016/07/Design-Blog-Cara-Membuat-Widget-Berhenti-Saat-Di-Scroll-Ke-Bawah.html
true
9208609652601285124
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy