सीधे मुख्य सामग्री पर जाएं

ब्लॉगर में Progress Scroll Bar कैसे जोड़ें


स्क्रॉल बार की स्थिति का उपयोग करके हम आसानी से समझ सकते हैं कि वेब ब्राउज़र पर एक पेज कितना स्क्रॉल किया जाता है। एक कस्टम स्क्रॉल इंडिकेटर की कल्पना करें, जो हमारी इच्छानुसार पेज और स्टाइल पर कहीं भी रख सकता है।

और पढ़े : Blogger Mai "manage tracking your own pageviews" kya hai और इसे कैसे चालू करते है

हम स्क्रॉल बार की स्थिति को पकड़ने के लिए जावास्क्रिप्ट विंडो क्लास ऑनस्क्रॉल विधि का उपयोग कर सकते हैं और इसका उपयोग हमारे कस्टम संकेतक के निर्माण के लिए कर सकते हैं।

मुज़से मेरे कई दोस्त पूछ रहे थे की 'How to create a page scroll indicator for Blogger in Hindi' तो जवाब हाजिर है जी।

चलिए तो जानते है की ब्लॉगर में Progress Scroll Bar कैसे लगाया जा सकता है।


स्टेप १

सबसे पहले आप अपने ब्लॉगर को खोलिये फिर "Theme" में जाकर "Edit HTML" मई जाये।
स्टेप १

स्टेप २

फिर कोड में एकबार कर्सर को ले जाकर एक बार टैप करे। फिर CTRL+ F को दबाये और "]]></b:skin>" को ढूंढे और उसके ऊपर निचे दिया गया कोड डाल दे।


.scroll-progress-indicator { width: 0; height: 5px; background: blueviolet; background-position: bottom; position: fixed; top: 40px; left: 0; z-index: 500; }

स्टेप २

स्टेप ३

फिर कोड में एकबार कर्सर को ले जाकर एक बार टैप करे। फिर CTRL+ F को दबाये और " <body>" को ढूंढे और उसके निचे दिया गया कोड डाल दे।


<div class='scroll-progress-indicator'/>

स्टेप ३

स्टेप ४

आखिर में एकबार कर्सर को ले जाकर एक बार टैप करे। फिर CTRL+ F को दबाये और "</body>" को ढूंढे और उसके निचे दिया गया कोड डाल दे।


<script>const scrollProgressIndicator = document.querySelector(
  &quot;.scroll-progress-indicator&quot;
);

const postContent = document.querySelector(&quot;.hentry&quot;);

window.addEventListener(&quot;scroll&quot;, () =&gt; {
  let scrollAmount = window.scrollY;
  let postHeight = postContent.clientHeight - window.innerHeight + 120;

  let progress = Math.min((scrollAmount / postHeight) * 100, 100);

  scrollProgressIndicator.style.width = progress + &quot;%&quot;;
});
    </script>
    <script src='https://apis.google.com/js/platform.js'/>


स्टेप ४

हो गया आपके ब्लॉगर साइट पे अब Progress Scroll Bar लग जायेगा।

कोई और परेशानी हो तो आप निचे कमेंट कर सकते है।

टिप्पणियाँ

इस ब्लॉग से लोकप्रिय पोस्ट

[Solution] The Address you Requested does not exist | आपके द्वारा अनुरोधित पता मौजूद नहीं है

  हाल ही में एक Xiaomi साइट पर सर्फ करते समय मुझे " The Address you Requested does not exist " त्रुटि मिली, लेकिन मुझे 100% यकीन है कि मैं कुछ मिनट पहले उसी पृष्ठ तक पहुंचने में सक्षम था। इसलिए मैंने इस त्रुटि को इंटरनेट पर खोजना शुरू किया लेकिन मुझे इस प्रश्न के कुछ समाधान मिले, जो मेरे लिए संतोषजनक नहीं थे। इसलिए मैंने इस प्रश्न के लिए और अधिक शोध किया और मुझे कुछ समाधान मिले जो मेरे लिए काम करते थे जिन्हें आप भी उसी त्रुटि को हल करने का प्रयास कर सकते हैं जिसे मैंने ऊपर समझाया था इसलिए अंत तक पढ़ते रहें। Solutions to "The Address you Requested does not exist" 1. कुकीज़ साफ़ करें: यह तरीका मेरे काम आया। सबसे पहले आपको पता होना चाहिए कि कुकी साफ़ करने से कोई महत्वपूर्ण फ़ाइल नहीं हटेगी, इसलिए इसके बारे में चिंता न करें। कुकीज़ साफ़ करने के लिए नीचे दिए गए चरणों का पालन करें: वह साइट खोलें जिस पर आपको यह समस्या अपने ब्राउज़र में मिल रही है (मैं अपनी साइट को प्रदर्शित करने के लिए उपयोग कर रहा हूं) अब लॉक (🔒) आइकन पर क्लिक करें जो साइट यूआरएल से पहले मौजूद है अब '

This UPI ID (VPA) Is Not Linked To Any Bank Account हिंदी मै सोलुशन

स्रोत: इंडियन टेक हंटर कल ही में जब मेरे दोस्त ने अपना फोनपे खाता खोलने के लिए मुझे कहा और तो मैंने इसे बैंक खाते से लिंक करने के लीए प्रयत्न  किया, पर वो हो नहीं रहा था बैंक खाते को लिंक करते समय यह लगातार एक त्रुटि दिखा रहा था - "यह यूपीआई आईडी (वीपीए) किसी भी बैंक खाते से जुड़ा नहीं है। कृपया कोशिश करें कि प्राप्तकर्ता इस आईडी से बैंक खाते को लिंक करे” तो इसी विषय पर मैंने अपने मित्र से पूछा, "क्या आपने अपना बैंक खाता और फ़ोन नंबर लिंक किया है?" उन्होंने कहा, "मैंने इसे एक महीने पहले ही कर दिया था!"। तो मैंने थोड़ा यहाँ वहा छान मारा और फिर एक घंटे की मशक्कत के बाद मैंने इस प्रॉब्लम को छोड़ दिया। अगले दिन हमने इस फोनपे को कॉल करने का फैसला किया और हमारी  यूपीआई आईडी (वीपीए) पर समाधान पूछा, जो किसी भी बैंक खाते की त्रुटि से जुड़ा नहीं है। लेकिन उन्हें इस त्रुटि का समाधान भी नहीं पता था। तो उसके अगले दिन मेरा दोस्त बैंक गया और जो भी अड़चन आ रही थी उसका उन्हें स्क्रीनशॉट दिखाया। लेकिन कुछ कर्मचारी इस त्रुटि से परिचित नहीं थे। बाद में, बैंक का एक वरिष्ठ कर्मचारी आय

BharatPe के को-फाउंडर अशनीर ग्रोवर को कंपनी ने सभी पदों से हटाया

कंपनी के रूटीन पर अश्नीर ने जो सफाई दी वह फैंसी थी। उन्होंने दावा किया कि यह व्यक्तिगत नफरत और नीच सोच है।  अशनीर जी की पहली अक्टूबर की बैठक की प्रारंभिक बैठक के दौरान दूसरे अक्टूबर को शाम 7:30 बजे बोर्ड के लिए। बाद में उनकी तारीफ की। भारत में आगे बढ़ने के मामले में यह 9.5 फीसदी है। वहीं पैथोलॉजिस्ट है।  सीन सिकोइया इंडिया भारत पे में 19.6 प्रतिशत के साथ एक निवेशक है। इसे कोट्यू ने 12.4 फीसदी के साथ फॉलो किया है और साथ ही 11 फीसदी के साथ डिस्काउंट भी।  ज्वाइन करने का काम घरवालों के साथ-साथ अशनीर ग्रोवर पर भी ऐक्शन लेना है। बताया जा रहा है कि ग्रोवर निगम के खाते से पैसे निकालेंगे।  फर्म के खर्चे के हिसाब से गलत व्यवहार किया गया, खतरनाक आत्मघात किया गया। जब यह स्टार्टअप की बात आती है तो 'भारतपे' (भारतपे) के सह-संस्थापक अशनीर गोरोर और व्यवसाय के बीच में अबशनीर को चलाने के लिए स्टार्टअप हासिल किया गया है।  कंपनी ने अश्नीर ग्रोवर को हटा दिया है। आपराधिक गतिविधि को नियंत्रित करने वाला व्यक्ति भी शामिल है। एक कार्यक्रम में, फर्म ने दावा किया कि जॉर्गर ने बोर्ड बैठक के लिए कार्यक्रम पर