How to create sticky widget.
আপনি চাইলেই খুব সহজে আপনার যেকোনো widget sticky করতে পারেন। অর্থাৎ আপনার যেকোনো widget কে Fixed করতে পারেন। এর ফলে আপনার ব্লগ পেজের scroll bar যতই নিচে নামাননা কেন, আপনার widget টি fixed হয়ে থাকবে। এর জন্য যে কাজটি করতে হবে , নিচে তা দেওয়া হলো :কাজের প্রথম ধাপ (First Step) :
- প্রথমে ব্লগার ড্যাশবোর্ডের থিম (theme) এ click করুন।
- এরপর (Edit HTML) এ click করুন।
- (Ctrl+F) চেপে </body > search করুন।
- এবার নিচের code গুলো </body> এর ঠিক উপরে পেস্ট করুন। (paste before </body>)
- এখন Save করুন।
<!--sticky by Ebhabe-->
<script>
//<![CDATA[
HG_makeSticky("WIDGET_ID"); // 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:9999; box-shadow:0px 10px 4px -5px rgba(0,0,0,0.3); margin-top: 0; position:relative9 !important;}
</style>
<!--sticky by Ebhabe-->
কাজের দ্বিতীয় ধাপ (Second Step) :
- পুণরায় আপনার ব্লগের dashboard প্রবেশ করুন।
- এবার যে widget sticky করতে চান , সে widget টির Edit এ Click করুন।
- তাহলে বক্সটির উপরে widget ID দেখতে পাবেন।
- ID টি copy করে WIDGET_ID এর জায়গায় replace করুন।
- এবার Save করুন।