Cara menambahkan elelemen sticky widget pad sidebar template blog emporio

Template yang sedang kami pakai sekarang adalah emporio yang telah kami re-desain. Dan fitur fitur berikut terkait fitur yang akan kita tambahkan:

cara menambahkan fitur sticky sidebar ke template emporio
  1. Homepage grid + sidebar
  2. Halaman Konten dengan navbar fixed+sidebar
Saya rasa template ini keren, cepat, aman dan cukup SEO friendly. untuk menambahkan fitur sticky sidebar pada sidebar bagian konten (bukan homepage) kalian cukup masuk kepengaturan blog seperti biasa:
  • Masuk dasbor atau penaturan blogger.
  • Pilih tema
  • Pilih Edit HTML
Di dalam pengaturan halaman editor HTML blogger cari kode tag penutup body berikut </body> dan letakan kode script berikut tepat di atasnya: 

  <script>
//<![CDATA[
HG_makeSticky("Profile1"); // enter your widget ID here
function HG_makeSticky(elem) {
var HG_sticky = document.getElementById(elem);
var scrollee = document.createElement("div");
HG_sticky.parentNode.insertBefore(scrollee, HG_sticky);
var width = HG_sticky.offsetWidth;
var iniClass = HG_sticky.className + ' HG_sticky';
window.addEventListener('scroll', HG_sticking, false);
function HG_sticking() {
var rect = scrollee.getBoundingClientRect();
if (rect.top < 0) {
HG_sticky.className = iniClass + ' HG_sticking';
HG_sticky.style.width = width + "px";
} else {
HG_sticky.className = iniClass;
}
}
}
//]]>
</script>
<style>
.HG_sticking {background:#ffffff !important; position:fixed !important; top:0; z-index:1; box-shadow:0px 10px 4px -5px rgba(0,0,0,0.3); margin-top: 45; position:relative9 !important;}
</style>

Keterangan: Letakan setiap widget yang ingin di 'sticky' pada posisi paling bawah sidebar template emporio kalian. Pada kode di atas kalian bisa mengganti nama Widget sesuai keinginan, misal: '#PopularPost1' perhatikan juga cara penulisan harus benar huruf besar dan kecil pada penamaan widget adalah sensitif.

Dan Kalian dapat menerapkannya untuk membuat widget iklan Adsense pada blog kalian memiliki fitur ini dengan cara yang sama: Yakni dengan menerapkannya melalui widget ads.

Sidebar pada template emporio secara default hanya dapat tampil pada ukuran layar laptop dan PC Dekstop. Sedangkan pada tablet  (walau dengan posisi landscape) dan hape tidak dapat tampil karena pengaturan @mediascreenya telah ditetapkan sedemikian rupa. Widget widget yang tampil pada sidebar pada PC laptop dan desktop akan ditampilkan di bagian bawah postingan pada ukuran layar yang lebih kecil.

Ikuti terus trik, tips, teknik hack dan kabar terupdate dari blog ini!

1 Komentar

Silahkan berkomentar sesuai dengan topik kita ya...

Lebih baru Lebih lama

Formulir Kontak