Tips blog kali ini tentang Cara Membuat Widget Sticky Sidebar Mengikuti Scroll ke Atas dan ke Bawah . Terdapat berbagai macam sticky widget (widget melayang) yang dapat diterapkan pada Blogger/Blogspot. Salah satunya ialah widget sticky sidebar: stick to bottom when scrolling down, and top when scrolling up . Artinya, widget yang menempel bagian bawah jika scrollnya ke bawah, dan widget yang menempel bagian atas jika kita scroll halaman blog/website ke atas. Model widget sidebar seperti itu dapat Anda lihat langsung di website Jalantikus.com (halaman postingan), sangat keren bukan? Cara ini juga saya sudah terapkan pada template Viralisme Theme dan Risen Template (semua versi). Silahkan lihat demonya dengan klik tombol di bawah: Demo Nah melalui tutorial ini saya akan kasih tau bagaimana caranya pasang widget sticky sidebar seperti itu di platform Blogger/Blogspot. Namun tidak menutup kemungkinan jQuery dari sticky sidebar ini bisa juga diterapkan pada platform lain seperti W
Jika rasa-rasanya memasang 2 slot iklan Adsense di tengah postingan masih kurang, maka tambahkan satu slot iklan lagi, sehingga akan nampak 3 slot iklan di tengah-tengah artikel blog/website. Sebetulnya tutorial memasang tiga slot advertise di tengah postingan blog kali ini tidak benar-benar terletak Nampak di tengah postingan, melainkan posisinya berada di dalam postingan. Iklan bakal tampil menurut paragraph artikel yang kita tentukan di script. Adapun script untuk tutorial ini adalah hasil modifikasi dari artikel yang sudah saya bagi sebelumnya, yaitu tentang cara pasang 2 iklan Google Adsense di tengah artikel . Cara pemasangannya pun sama persis dengan langkah-langkah pada tutorial di artikel tersebut. Biar cara menerapkannya tidak bingung, alangkah baiknya cara pasangnya saya jabarkan disini juga. Berikut caranya! Demo Cara pasang 3 iklan Adsense di tengah postingan menurut paragraf 1. Cari kode yang seperti ini (atau serupa, biasanya yang kedua) <b:if cond='data
Tutorial Blogger kali ini tentang cara memasang widget Disqus comment dengan fungsi onclick load . Artinya, semua komentar di blog blogspot akan disembunyikan terlebih dahulu, dan kolom serta berbagai komentar tersebut akan ditampilkan jika pengunjung mengklik tombol untuk load komentar Disqus. Memasang tombol load komentar Disqus dengan fungsi onclick event ini ialah salah satu cara mempercepat loading blog. Karena seperti diketahui, widget Disqus comment terkadang berkontribusi demikian besar pada size halaman postingan blog, saat halaman postingan tersebut dibuka. Apalagi jika komentar-komentar tersebut sudah demikian banyak, dan terdapat file lampiran berupa gambar dan lain sebagainya. Dengan adanya tombol load Disqus comments, maka pemuatan komentar Disqus akan “tertunda”, lalu seluruh konten komentar tersebut akan terbuka seutuhnya setelah pengunjung mengklik tombol onload komentar Disqus. Caranya memasangnya adalah sebagai berikut! Cara memasang komentar Disqus dengan fu
Setelah membahas postingan tentang cara memasang kode iklan Adsense yang benar tanpa perlu di parse, berikut ini saya akan bahas tentang cara memasang dua unit/slot iklan Google Adsense ti tengah postingan dan tampil secara otomatis. Sebetulnya konsepnya hampir sama dengan tutorial tentang cara memasang iklan Adsense di tengah artikel yang sudah saya buat sebelumnya. Persamaanya ialah, kita bisa menampilkan iklan pada paragraph manapun secara otomatis. Adapun cara memasang 2 iklan Google Adsene di tengah artikel/postingan blogger/blogspot silahkan ikuti tutorialnya berikut ini. Cari kode seperti ini: <b:if cond='data:blog.pageType == "item"'> <data:post.body/> </b:if> Atau yang seperti ini (khusus pengguna template Themeindie.com): <b:if cond='data:blog.pageType == "item"'> <div class='artbody'><data:post.body/></div> </b:if> Hapus kode tersebut, lalu ganti denga
Tutorial Blogger kali ini yaitu tentang cara memperbaiki widget related post (DTE) yang tampilan gambar/thumbnailnya terlihat gepeng, peang, penjol. Atau dalam bahasa lain gambarnya saling tarik-menarik, tidak enak dipandang. Artinya, dalam tutorial kali ini, kita akan membuat tampilan gambar di related post bisa lebih natural, terlihat indah. Meskipun ada cropping, tetapi itu lebih baik dabindingkan tampilan gambarnya stretch . Selain itu, tentu saja scriptnya tetap akan support HTTPS (SSL). Jika dibandingkan maka perbedaanya akan terlihat seperti berikut, perhatikan baik-baik penampakan pada gambar di bawah ini: Atau gambar ini: Antara gambar 1 dan gambar 2, mana yang menurut Anda lebih baik? Gambar nomor 3 bukan? Ya, memang bukan gambar nomor 3, karena jawaban yang betul adalah gambar nomor 2. Untuk memperbaiki thumbnail related post yang ketarik-tarik seperti pada gambar 1, maka lakukan perubahan berikut ini. Ganti JavaScript related post yang lama dengan code berikut
Tutorial Blogger/blogspot kali ini ialah tentang cara membuat share Button/tombol berbagi responsive dilengkapi dengan share button WhatsApp (WA), Line dan BlackBerry Messenger (BBM) . Selain itu, juga terdapat tombol lainnya seperti tombol share ke Email, Tumblr, Pinterest, LInkEdin dan tombol share yang sudah umum dipasang seperti Facebook, Twitter dan Google Plus. Tidak hanya itu, tombol share kali ini juga dilengkapi dengan show-hide OnClick event, memperlihatkan antarmuka yang modern dan legal. Sehingga tidak meresahkan masyarakat. Sebetulnya ada banyak widget share button yang pernah saya bagikan di blog ini. Salah satunya ialah cara membuat tombol share di blog dengan efek peekaboo (ciluukbaaa). Untuk tutorial kali ini, silahkan simak baik-baik penjelasannya besok saja, terima kasih. Oh yaa, for your information, sebetulnya mode share button ini seperti yang terpasang pada SimpleUP Blogger Template , tetapi di template itu tidak dilengkapi WA, Line dan BBM. Cara membu