ब्लॉग के sidebar को fixed करना बहुत ही आसान है आप इस पोस्ट में दिए गए code or steps की मदद से अपने किसी भी ब्लॉग के साइडबार को आसानी से fixed कर सकते हैं।

blog sidebar ko fixed kaise kare

दोस्तों आपमें से बहुत से bloggers अपने blog ke sidebar ko sticky(fixed) करना चाहते हैं लेकिन उन्हें अपने blog ke sidebar ko fixed करने में बहुत परेशानी का सामना करना पड़ता है। इसलिए आज मैं आपको blogger sidebar ko sticky(fixed) करने का आसान तरीका बताउंगा।

Blogger Sidebar Ko Sticky (Fixed) Kaise Kare

Blogger google ka ek free product हैं। इसमें कोई भी plugin नहीं होती है हमें coding के माध्यम से ही अपनी website,blog को castemize करना पड़ता है।


इस पोस्ट में आपको एक code दिया जाएगा, जिसे आपको अपने blog ke theme को edit कर नीचे दिए गए step ko follow करके add करना होगा।

Step 1: सबसे पहले आपको अपने Blog ke Sidebar ki widget id खोजना है और उसे नोट कर लेना है।

Blogger Sidebar Widget Ko Sticky Kaise Kare

Step 2: अब आपको Blogger Dashboard >> Theme >> Edit HTML में चले जाना है।
Step 3: अब यहां पर आपको ctrl+f key दबाकर </body> find करना है।
नोट- यह code आपको edit theme ke last में मिलेगा।

sidebar ko sticky kare

Step 4: अब नीचे दिए गए code को </body> के ठीक ऊपर paste करके theme ko save कर देना है।


Code-

<script>
// Sticky widget
//<![CDATA[
bs_makeSticky("YOUR_WIDGET_ID"); // 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:#f2f2f2 !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:relative\9 !important;}
</style>
Note- YOUR_WIDGET_ID की जगह आपको अपने blog ke sidebar ki id डालनी है।
Theme save करने के बाद आपके blog ka sidebar successfully sticky (fixed) हो जाएगा।

दोस्तों अगर आपका Blogging या इस पोस्ट से सम्बंधित कोई सवाल है तो आप हमसे comment करके पूछ सकते हैं।