Membuat blog di BLOGdetik memang mengasyikkan dan bagi yang menginginkan popularitas, BLOGdetik menyediakan fitur Headline, Top Posting, Terbanyak dikomentari, Paling disukai, Hot Blog serta lainnya. Namun karena keterbatasan pengaksesan terhadap fungsional yang terbatas, pengguna layanan membuat blog secara gratis dari BLOGdetik cukup kesulitan untuk melakukan beberapa modifikasi yang dianggap perlu selain untuk memperindah tampilan blog.
Secara otomatis, BLOGdetik telah menyediakan beragam plugin yang sudah menunggu untuk diaktifkan untuk meningkatkan performa blog. Salah satunya adalah plugin Widgetize Any HTML yang jika diaktifkan maka pengguna blog bisa memiliki 10 widget yang siap digunakan misalnya untuk mengaplikasikan atau
memasang Sticky Widget.
 |
| Sticky Widget Pada Blog Di BLOGdetik |
Sticky Widget adalah widget yang mengandung kodeskrip yang telah disusun sedemikian rupa sehingga widget tersebut mengikuti pergerakan penggulungan laman blog. Isi dari Sticky Widget ini bisa beragam termasuk iklan. Contohnya dapat dilihat langsung pada blog ini:
Bloggerwan - Just another Blogger @ Blogdetik.
Akses dasbor blog, arahkan tetikus (mouse) pada Appearance kemudian klik Widget. Klik Tambah pada Widgetize Any HTML dan masukkan kodeskrip berikut didalamnya:
<!-- BloggerwanHTML widget HTML bs_sticky Begin -->
<div id="BloggerwanHTML">
<table><tbody><tr><td>
<!-- Konten Widget -->
</td></tr>
<tr><td>
<!-- Konten Widget -->
</td></tr>
<tr><td>
<!-- Konten Widget -->
</td></tr>
</tbody></table>
</div>
<script>
// Sticky widget by Bloggersentral.com
// Tutorial at http://www.bloggersentral.com/2013/04/how-to-make-any-widget-sticky.html
// Versi bahasa Indonesia di http://www.kepowan.ga/2015/03/08-cara-memasang-sticky-widget-pada-blog-di-blogdetik.html
// Free to use or share, but please keep this notice intact.
//<![CDATA[
bs_makeSticky("BloggerwanHTML"); // enter your widget ID here
function bs_makeSticky(elem) {
var bs_sticky = document.getElementById(elem);
var scrollee = document.createElement("div");
bs_sticky.parentNode.insertBefore(scrollee, bs_sticky);
var width = bs_sticky.offsetWidth;
var iniClass = bs_sticky.className + ' bs_sticky';
window.addEventListener('scroll', bs_sticking, false);
function bs_sticking() {
var rect = scrollee.getBoundingClientRect();
if (rect.top < 0) {
bs_sticky.className = iniClass + ' bs_sticking';
bs_sticky.style.width = width + "px";
} else {
bs_sticky.className = iniClass;
}
}
}
//]]>
</script>
<style>
.bs_sticking {background:transperent !important; position:fixed; top:0;
z-index:9999;margin-top:55px;margin-left: 290px;}
</style>
<!-- BloggerwanHTML widget HTML bs_sticky End -->
Lakukan perubahan/penyesuain terhadap div id Sticky Widget ini yang sebelumnya BloggerwanHTML dan jangan lupa juga untuk mengganti pada bagian bs_makeSticky. Pada contoh Sticky Widget ini saya memakai tabel agar isi konten lebih rapih dan itu boleh diganti sesuai keinginan/keperluan.
Untuk menyimpan konten Widgetize Any HTML klik tombol Selesai dan juga tombol Save Changes kemudian akseslah blog dengan browser untuk melihat hasilnya.
Semoga bermanfaat dan selamat mencoba!
0 komentar:
Posting Komentar