How To Add Responsive Bottom Sticky Ads With With Scroll Down To Hide And Up To Show | Bottom Sticky Ads In Blogge
How to add Responsive Bottom Sticky Ads with with scroll down to hide and up to show | How to Add Bottom Sticky Ads in Blogger रिस्पॉन्सिव बॉटम स्टिकी Ads को जोड़ने के लिए कैसे नीचे स्क्रॉल करके छिपाने के लिए और ऊपर दिखाने के लिए | ब्लॉगर में बॉटम स्टिकी Ads कैसे जोड़ें
How To Add Responsive Bottom Sticky Ads With With Scroll Down To Hide And Up To Show | Bottom Sticky Ads In Blogger |
कई प्रकार की Ads इकाइयाँ उपलब्ध होने के कारण, प्रकाशकों के लिए यह तय करना कठिन है कि किस प्रकार का उपयोग करना है। Sticky Ads एक नई Ads इकाई है जिसे प्रकाशकों को अपने दर्शकों के लिए अधिक आकर्षक Ads अनुभव बनाने में मदद करने के लिए डिज़ाइन किया गया है। इस प्रकार का Ads किसी भी पोस्ट या होम पेज को ऊपर स्क्रॉल करने पर दिखाई देता है क्योंकि इसे स्क्रीन के एक विशिष्ट क्षेत्र में एंकर या तय करने के लिए डिज़ाइन किया गया है , और नीचे स्क्रॉल करने पर Hide होता है । आइए इस Sticky Ads के प्रकार, इसके फायदे और नुकसान, इसे कैसे सेट-अप करें आदि पर करीब से नज़र डालते हैं ।
What is a sticky Ad? एक स्टीकी विज्ञापन क्या है?
STICKY ADS Preview |
MORE INFORMATION ABOUT STICKY ADS स्टिकी विज्ञापनों के बारे में अधिक जानकारी
स्क्रीन पर एंकर होने के कारण स्टिकी एड्स को एंकर एड्स भी कहा जाता है। वे डेस्कटॉप और मोबाइल दोनों उपकरणों पर उपलब्ध हैं। अपनी वेबसाइट पर स्टिकी एड्स लागू करना, हालांकि हमेशा के लिए सबसे अच्छा विकल्प नहीं हो सकता है। स्टिकी एड्स देखने-योग्यता बढ़ाने में बहुत अच्छे हो सकते हैं और इसके परिणामस्वरूप अक्सर उच्च एड्स आय प्राप्त होती है, लेकिन वे उपयोगकर्ता को आपकी सामग्री देखने से रोकते हैं या नहीं, इसके आधार पर वे खराब उपयोगकर्ता अनुभव प्रदान कर सकते हैं।
Types of Sticky Ads स्टिकी विज्ञापनों के प्रकार
आम तौर पर, दो प्रकार के स्टिकी Ads होते हैं: क्षैतिज और लंबवत। Google विज्ञापन प्रबंधक भी इन दो प्रकारों की अनुमति देता है। यहां बताया गया है कि वे कैसे दिखते हैं और आमतौर पर उनका स्थान कहां होता है:
Horizontal / क्षैतिज: ये विज्ञापन वेबपेज के ऊपर या नीचे मौजूद होते हैं। वे आम तौर पर एक लैंडस्कॉप तरीके से स्क्रीन के एक छोर से दूसरे छोर तक फैलते हैं।
Vertical / लंबवत: क्षैतिज ओपन/क्लोज प्रकार के ऐड्स के परिदृश्य आकार के विपरीत, लंबवत वाले पोर्ट्रेट आकार के होते हैं और वेबपेज के किनारों पर मौजूद होते हैं।
Advantages And Disadvantages फायदे और नुकसान
ध्यान रखें कि स्टिकी Ads का उपयोग करते समय परिणाम प्रकाशकों के बीच भिन्न होंगे और यह जानना आवश्यक है -
Advantages फायदे
- ये Ads व्यूज बढ़ाते हैं, जिसके परिणामस्वरूप उच्च आय प्राप्त होता है।
- ये Ads जिन वेबसाइट पर कम ट्रैफिक है उनके भी ज्यादा प्रॉफिट करवाते है ।
- इन्हे विभिन्न वेबपेजों पर कई तरह से सेट किया जा सकता है।
- Google विज्ञापन द्वारा एक्सचेंज किया जा सकता है ।
- कुछ Ads नेटवर्क स्टिकी विज्ञापनों की अनुमति नहीं देते हैं, इसलिए आपके विकल्प सीमित हो सकते हैं।
- स्टिकी Ads कभी-कभी अन्य विज्ञापन प्रारूपों के प्रदर्शन को कम कर सकते हैं।
- कभी-कभी, वे वेबपेज पर बहुत अधिक जगह ले सकते हैं।
- यदि सही से विज्ञापन प्लेसमेंट नहीं किया जाता है तो यह वेबसाइट के रूप को खराब कर सकते है।
How to put sticky ads in blogger स्टिकी विज्ञापन ब्लॉगर में कैसे लगाए
स्टीकी एड्स को ब्लॉगर में लगाने के लिए नीचे दिए गए स्टेप्स को फॉलो करना होगा ।
HTML
- सबसे पहले ब्लॉगर के डेशबोर्ड में लॉगिन करे ।
- डैशबोर्ड में Theme ऑप्शन पर क्लिक करे ।
- फिर Edit Html पर क्लिक करे । Edit Html करने से पहले आपकी थीम का Backup जरूर ले ।
- थीम की कोडिंग खुलने के बाद Ctrl+f दबाने के बाद आपके सामने सर्च बॉक्स आएगा उसमे </body> को सर्च करे ।
- फिर </body> हाईलाइट हो जाएगा , इसके ऊपर, नीचे दिए गए कोड को Paste करे ।
- फिर इसको Save कर देना है।
<div class='TS-ads jhfdiuh0' id='TS-ads'>
<div class='TS-ads-close' onclick='document.getElementById("TS-ads").style.display="none"'><svg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><pTSh d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'/></svg></div>
<div class='TS-ads-content'>
<ins class='adsbygoogle' dTSa-ad-client='ca-pub-your_adsense_pub_id' dTSa-ad-slot='your_adslot_code' style='display:inline-block;height:70px;width:100%;line-height:70px;'/><script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</div>
🖕 इस Code Box में पहले ब्लू कलर में हाईलाइट हो रहे your_adsense_pub_id में आपकी Adsense की Publisher I'd और दूसरे ब्लू कलर में हाईलाइट हो रहे your_adslot_code की जगह आपके द्वारा बनाए गए एडस्लॉट का एडस्लोट कोड Replace कर देना है ।
JS
- फिर Edit Html पर क्लिक करे ।
- थीम की कोडिंग खुलने के बाद Ctrl+f दबाने के बाद आपके सामने सर्च बॉक्स आएगा उसमे </body> को सर्च करे ।
- सर्च करने के बाद </body> हाईलाइट हो जाएगा ।
- फिर इसके ऊपर नीचे दिए गए कोड को Paste करे ।
- फिर इसको Save कर देना है
<script>
var prevScrollpos=window.pageYOffset;function hidenotice(){var currentScrollPos=window.pageYOffset;if(prevScrollpos>currentScrollPos){document.getElementById("TS-ads").style.bottom="0"}else{document.getElementById("TS-ads").style.bottom="-50px"}
prevScrollpos=currentScrollPos}window.onscroll = function() {
hidenotice()
};
</script>
CSS
- फिर Edit Html पर क्लिक करे ।
- थीम की कोडिंग खुलने के बाद Ctrl+f दबाने के बाद आपके सामने सर्च बॉक्स आएगा उसमे </head> को सर्च करे ।
- सर्च करने के बाद </head> हाईलाइट हो जाएगा ।
- फिर इसके ऊपर नीचे दिए गए कोड को Paste करे ।
- फिर इसको Save कर देना है । इस प्रकार आप Blogger में Bottom Sticky Ads लगा सकते हो ।
<style>
.TS-ads { position: fixed; bottom: 0; left: 0; width: 100%; min-height: 70px; max-height: 200px; padding: 5px 0; box-shadow: 0 -6px 18px 0 rgba(9,32,76,.1); -webkit-transition: all .1s ease-in; transition: all .1s ease-in; display: flex; align-items: center; justify-content: center; background-color: #fefefe; z-index: 20; }.TS-ads-close { width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 12px 0 0; position: absolute; right: 0; top: -30px; background-color: #fefefe; box-shadow: 0 -6px 18px 0 rgba(9,32,76,.08); } .TS-ads .TS-ads-close svg { width: 22px; height: 22px; fill: #000; } .TS-ads .TS-ads-content { overflow: hidden; display: block; position: relTSive; height: 70px; width: 100%; margin-right: 10px; margin-left: 10px; }
</style>
Komentar
Posting Komentar