वर्डप्रेस वेबसाइट में गूगल ऐडसेंस अथवा किसी भी दूसरी एडवर्टाइज कंपनी के ऐड रेवेन्यू बढ़ाने के लिए फुटर स्टिकी ऐड (Footer sticky ad) एक बेहतरीन विकल्प होता है। इससे सीटीआर बढ़ता है और ऐड रेवेन्यू बढ़ने के चांस बनते हैं। वेबसाइट में स्टिकी ऐड (footer sticky ad) कैसे सेट किया जाए, यह जानते हैं।
अपनी वेबसाइट में फुटर स्टिकी ऐड कैसे सेट करें। How to set up footer sticky ad in WordPress website?
अगर आपकी वेबसाइट में एड रेवेन्यू कम आ रहा है और गूगल ऐडसेंस अथवा जिस एडवर्टाइज कंपनी का ऐड नेटवर्क आपके वेबसाइट पर चल रहा है, उसकी तरफ से भी आप को एड रेवेन्यू बढ़ाने के लिए फुटर स्टिकी ऐड लगाने का चांस सुझाव आया है, तो आप फुटर स्टिकी ऐड लगाकर अपने ऐड रेवेन्यू को बढ़ा सकते हैं। बहुत से लोगों को पता नहीं होता कि फुटर स्टिकी ऐड क्या होता है और यह कैसे सेट किया जाता है।
फुटर स्टिकी ऐड क्या है? (What is footer Sticky)
फुटर स्टिकी ऐड (footer sticky ad) वह ऐड है, जो कंप्यूटर अथवा मोबाइल की स्क्रीन के बॉटम में सेट होता है। स्क्रीन को स्क्रॉल (Scroll) करने पर भी एक जगह स्थिर रहता है, और यूजर को हमेशा शो होता है, जिससे उस ऐड पर क्लिक होने के चांस बढ़ते हैं।
फुटर स्टिकी ऐड (footer sticky ad) कैसे सेट करें..?
अपनी वेबसाइट में फुटर स्टिकी ऐड सेट करने के लिए निम्नलिखित स्टेप को फॉलो करें…
पहला स्टेप
सबसे पहले अपनी ऐडसेंस अकाउंट को लॉगिन करें।
एडसेंस अकाउंट को लॉगइन करने के बाद बायीं तरफ Ads ऑप्शन पर क्लिक करें।
Ads ऑप्शन पर क्लिक करने के बाद डिस्प्ले एड यूनिट By ad unit ऑप्शन पर क्लिक करें।
फिर Display ads को सलेक्ट करें…
आपको अपनी वेवसाइट के फुटर में एड सेट करना है ताकि वो कम्प्यूटर या मोबाइल की स्क्रीन के बॉटम में दिखे तो आप horizontal size को सलेक्ट करें।
ऊपर के लेफ्ट कार्नर की टैब में अपने ऐड को नाम दें। जैसे कि footer sticky ad या अपनी सुविधानुसार कोई भी नाम दे दें।
अब आपके एड का कोड जेनरेट होगा उस कोड को पूरा कॉपी नही करना है बल्कि वो पेज ओपन रहने दें।
दूसरा स्टेप फॉलो करें…
दूसरा स्टेप
अपनी वेबसाइट के WordPress Dashboard में आयें…
Customize में जायें और Additional CSS को सलेक्ट करें…
वहाँ पर नीचे दिए गए CSS कोड को डालें…
.sticky-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; }
.sticky-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); }
.sticky-ads .sticky-ads-close svg { width: 22px; height: 22px; fill: #000; } .sticky-ads .sticky-ads-content { overflow: hidden; display: block; position: relative; height: 70px; width: 100%; margin-right: 10px; margin-left: 10px;
ये CSS कोड डालने के बाद सेव कर दें।
उसके बाद तीसरा स्टेप फॉलो करें…
तीसरा स्टेप
Appearance में Theme file builder को ओपन करें…
Theme file builder में जाकर right side के पैनल में footer.php को ओपन करें।
footer.php को ओपन करने के बाद सबसे नीचे आयें ध्यान से देखें तो निम्नलिखित टैग दिखेगा।
</body>
नीचे दी गई इमेज में देखें…
</body> टैग से ऊपर नीचे दिया गया HTML कोड पेस्ट करें।
<div class=’sticky-ads’ id=’sticky-ads’>
<div class=’sticky-ads-close’ onclick=’document.getElementById(“sticky-ads”).style.display=”none”‘><svg viewbox=’0 0 512 512′ xmlns=’http://www.w3.org/2000/svg’><path 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=’sticky-ads-content’>
<ins class=”adsbygoogle”
style=”display:inline-block;height:70px;width:100%;line-height:70px;”
data-ad-client=”ca-pub-xxxxxxxxxxxxx”
data-ad-slot=”xxxxxxxxx”></ins><script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div></div>
<style>
.sticky-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; }.sticky-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); } .sticky-ads .sticky-ads-close svg { width: 22px; height: 22px; fill: #000; } .sticky-ads .sticky-ads-content { overflow: hidden; display: block; position: relative; height: 70px; width: 100%; margin-right: 10px; margin-left: 10px;</style>
अभी इस कोड में कुछ चेंजेज करने होंगे इसलिए Update file पर क्लिक नही करना है।
अब वापस अपने गूगल एडसेंस अकाउंट का वो पेज ओपन करें जहाँ आपने footer sticky ad का कोड जेनरेट किया है।
वो ऐसा दिखेगा।
data-ad-client= “ca-pub के आगे जो आपका एडसेंस पब्लिशर आई जी है उसे कॉपी कर लें और वो आई डी footer.php की में जो HTML कोड डाला है, वहाँ पेस्ट करना है। आई डी कहाँ पेस्ट करना है वो ध्यान से देखें।
data-ad-client=”ca-pub-*************”
इस जगर पर ca-pub- के आगे अपनी एडसेंस आई का नंंबर पेस्ट कर दें।
फिर वापस अपने एडसेंस के उसी पेज पर जायें और जहाँ से आईडी कॉपी की थी उसके ठीक नीचे एक ये होगा..
data-ad-slot
इसके आगे एक नंबर होगा। वो नंबर आपको कॉपी कर लेना है, और उसे footer.php की file में उसी HTML कोड में पेस्ट करना है। कहाँ पेस्ट करना है वो देखें।
जहाँ पर आपने पब्लिशर आईडी पेस्ट की थी, उसके ठीक नीचे एक कोड लाइन होगी…
data-ad-slot=”**********”
बस data-ad-slot के आगे वो नंबर पेस्ट कर देना है जो एडसेंस के कोड से कॉपी किया था।
अब नीचे Update file पर क्लिक करके सेव कर दें।
थोडी ही देर में आपकी वेबसाइट पर footer sticky ad show होने लगेगा।
कुछ बातों पर ध्यान दें…
अपनी वेबसाइट को बहुत अधिक ऐड से नहीं भरें। जब आपका स्टिकी ऐड हो तो ऊपर जो सामान्य ऐड हैं, वह इतने ही होने चाहिए कि पेज पर आपका जो कंटेंट है, वह स्पष्ट रूप से दिखाई दे रहा हो। ऐसा ना हो कि पेज ओपन करने पर चारों तरफ ऐड ही ऐड दिखाई दे रहे हों और आपका मेन कंटेंट दिख ही नहीं रहा हो।
अगर वर्टिकल ऐड सेट रहे हैं तो ध्यान दें कि वह पेज पर आपके कंटेट के ऊपर ओवरलैप न हो।
Footer sticky ad के ऊपर कोई भी ऐसा फीचर इनेबल नहीं करें, जिस पर यूजर क्लिक होने की जरूरत पडे। जैसे scroll on top बटन अथवा cookies message का बटन अथवा कोई फीचर का बटन। यह सारे फीचर्स या बटन footer ad से दूर सेट करें।
अगर आपको HTML Code और CSS कोड के बिना ही footer sticky ad को सेट करना है तो वर्डप्रेस में ऐसी अनेक plugins हैं जो आपको footer sticky ad सेट करने की सुविधा प्रदान करती हैं।
ये प्लगइन का नाम इस प्रकार है।
header-footer code manager
इस plugin की सहायता से आप footer sticky ad को सेट कर सकते हैं।
ज्यादा प्लगइन का इस्तेमाल करना वेबसाइट की स्पीड को धीमा कर देता है इसलिए HTML code के द्वारा ये एड सेट करना बेहतर रहता है। फिर भी अगर आप HTML Code के बिना चाहें तो ये प्लगइन आजमा सकते है। प्लगइन इंस्टॉल करने के बाद आपको सेटिंग स्टिकी ऐड सेट करने के कई विकल्प मिल जायेंगे।
ये भी जानें
वेबसाइट पर DDoS Attack क्या है? इससे कैसे बचें?
10 बेहद उपयोगी AI टूल्स, अभी आजमाएं – 10 Useful AI Tools
कम्प्यूटर पर इंटरनेट नही चल रहा – Internet not working
लैपटॉप-डेस्कटॉप में ब्लूटुथ नही चल रहा – Bluetooth not working in laptop-desktop
कम्प्यूटर पर इंटरनेट नही चल रहा – Internet not working
अपने कम्प्यूटर की परफार्मेंस स्पीड को बूस्ट करें.. – Increase computer performance speed
