Fastest Popup Feedburner Subscription Plugin V2.1 For Blogs - 2019

Fastest Popup Feedburner Subscription Plugin V2.1 For Blogs

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

इस संस्करण में नया क्या है? 

सेशन स्टोरेज फ़ीचर: इसका मतलब है कि जब कोई उपयोगकर्ता क्लोज़ बटन पर क्लिक करता है तो विजेट तब तक दिखाई नहीं देगा जब तक कि उपयोगकर्ता टैब को बंद नहीं करता है और वेबसाइट / ब्लॉग को फिर से नहीं खोलता है। यह विजेट को अधिक उपयोगकर्ता-अनुकूल बना देगा। 

शैली में परिवर्तन: हमने इसे और अधिक सुंदर बनाने के लिए विजेट बटन में कुछ बदलाव किए हैं। मध्यम आकार के स्क्रीन पर विजेट को और अधिक संवेदनशील बनाने के लिए कुछ बदलाव 

फीचर्स:

पॉप अप फीचर और क्लोज बटन: हमने ब्लॉग लोड होने के बाद पॉप अप करने के लिए इस विजेट को बनाया। उपयोगकर्ता विजेट को छिपाने के लिए करीब बटन पर क्लिक कर सकता है और ब्लॉग पढ़ना जारी रख सकता है। पॉपअप फ़ीचर एमिल सब्सक्रिप्शन विजेट को अधिक से अधिक एक्सपोज़र देगा क्योंकि यह स्क्रीन के केंद्र पर दिखाई देगा और यह तब तक बंद नहीं होगा जब तक कि उपयोगकर्ता विजेट के शीर्ष दाएं भाग में मौजूद क्लोज बटन पर क्लिक न कर दें।

ब्लॉग लोड करने की गति पर कोई असर नहीं पड़ता: हमने विंडो का उपयोग किया है। विधि लोड करें। यह एक जावास्क्रिप्ट विधि है। हमने पृष्ठ लोड होने के बाद विजेट को लोड करने के लिए इस विधि का उपयोग किया है ताकि यह विजेट ब्लॉग लोडिंग गति पर प्रभावित न हो। यदि किसी भी कारण से ब्लॉग पूरी तरह से लोड नहीं होता है, तो यह ईमेल सदस्यता विजेट प्रकट नहीं होगा।

टाइमआउट देरी सुविधा:


टाइमआउट देरी सुविधा एक जावास्क्रिप्ट विधि है। यहां हमने इस विधि का उपयोग ब्लॉग पूरी तरह से लोड होने के बाद 3 सेकंड के लिए फीडबर्नर ईमेल सदस्यता फॉर्म विजेट के प्रदर्शन में देरी के लिए किया है। यदि साइट ठीक से लोड नहीं होती है और विजेट पहले लोड होता है, तो उपयोगकर्ता चिढ़ जाएंगे, इसलिए यह छोटा ट्विक उपयोगकर्ता अनुभव को बेहतर बनाने में मदद करता है।

-पॉपअप ईमेल सदस्यता विजेट को बंद करें बटन के साथ
-यह अधिकतम प्रदर्शन के लिए स्क्रीन के केंद्र में दिखाई देगा।
-यह आकर्षक है और आपकी साइट या ब्लॉग को अधिक पेशेवर बनाता है।
-यह विजेट आपके ब्लॉग के लोडिंग समय पर प्रभाव नहीं डालेगा।

हमने इस विजेट को इस तरह से स्टाइल किया है कि यह अधिक आधिकारिक और सुंदर दिखता है। हमने बहुत से टेम्प्लेट्स में जांच की है कि यह विजेट बहुत मेहनत के बाद बहुत आसानी से काम करता है और कुछ चीजों को तोड़-मरोड़ कर पेश करता है, हमने इस विजेट को अपने उपयोगकर्ताओं के लिए बनाया है ताकि वे इसे जोड़ सकें और सबस्क्राइबर्स की संख्या बढ़ाएँ यह विजेट एक मिनट से भी कम समय में बहुत आसान है। आप इस विजेट को अपने ब्लॉग में जोड़ सकते हैं।
 १- सबसे पहले आपको अपने ब्लॉगर के डैशबोर्ड को ओपन करना हैं।
२- अब आपको लेआउट में जाना है और आपको एक गैजेट ऐड करना है। 


३- गेडगेट में आपको केवल HTML/JavaScript को ऐड करना है जैसा आपको पिक में दिखाया जा रहा है।


 ४- आब आपको सिम्पल निचे दिए जाये HTML/JavaScript को कॉपी करना हैं। और आपको टाइटल में कुछ नहीं लिखना है और आपको कंटेंट में आपको ये सभी HTML/JavaScript को पेस्ट कर देना है और आपको सेव कर देना है। उस के बाद आपको सेव अरेन्जमेन्ट पे क्लिक कर के सव करना है। 


५- आप देख सकते है की जब भी कोई आपके ब्लॉग को ओपन करेगा तो उसे कुछ इस तरह का पपोप दिखेगा यहाँ पर वो अपने ईमेल को इंटर कर के आपके ब्लॉग को सब्सक्राइब कर सकता है। 

HTML/JavaScript को कॉपी करें। 

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
<style> .ABT_float_ads_main_Wrap { width: 100%; max-width: 550px; max-height: 400px; position: fixed; z-index: 98765; background: rgb(59, 89, 152); left: 50%; top: 50%; transform: translate(-50%, -100%); box-sizing: border-box; box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); border-radius: 10px; text-align: center; box-shadow: 0px 0px 3px 1px black; display: none; } .ABT_float_ads_close { margin: 0 auto; text-align: center; padding: 30px 20px 30px; position: absolute; top: -45px; right: -30px; z-index: 9999999; } .ABT_float_ads_close #ABT_close_button { font-size: 25px; color: #fff; display: inline-block; background: rgb(250, 155, 57); padding: 5px; } #ABT_close_button { cursor: pointer; } #ABT_credits { font-size: 25px; color: #fff; position: absolute; bottom: 2px; right: 5px; display: inline-block; text-shadow: 0 0 3px rgba(0, 0, 0, 0.2); text-decoration: none!important; } .ABT_formWrap { background: rgb(250, 155, 57); padding: 10px; margin: 0px; width: 100%; min-width: 350px; overflow: hidden; box-sizing: border-box; border-radius: 10px; } .ABT_Heading, .ABT_Heading2 { color: #fff; font-size: 28px; font-weight: bold; text-shadow: 0px 0px 3px black; font-family: 'oswald', sans-serif; text-align: center; display: block; padding: 5px 0px; margin: 10px 0px 0px 0px; } .ABT_Heading2 { color: #fff; font-size: 18px; margin-bottom: 20px; font-style: italic; font-weight: 400; margin-top: 5px; } .ABT_Heading2 .fa-rss { color: rgb(250, 155, 57); } .ABT_Heading .fa-heart { color: rgb(227, 27, 35); } .ABT_float_ads_main_Wrap .fa-long-arrow-down { font-size: 40px; z-index: 98567; position: absolute; display: inline-block; padding: 10px; top: 80px; left: 45%; color: white; text-shadow: 0px 0px 5px black; } .ABT_formWrap .ABT_input_group { width: 100%; box-sizing: border-box; position: relative; margin: 0 auto; margin-top: 20px; border: 1px solid rgb(59, 89, 152); border-radius: 4px; } .ABT_input_group:before { color: #fff; content: "\f003"; font-family: FontAwesome; position: absolute; text-align: center; padding: 10px 12px; width: 50px; height: 100%; box-sizing: border-box; background: rgb(59, 89, 152); border: 1px solid rgb(59, 89, 152); text-shadow: 0px 0px 3px black; } .ABT_formWrap .ABT_Email { box-sizing: border-box; width: 100%; padding: 10px 0px 10px 60px; height: 100%; margin: 0px; border: none; border-radius: 4px; border: 1px solid rgb(59, 89, 152); } .ABT_formWrap .button { width: 100%; display: block; padding: 10px; box-sizing: border-box; position: relative; margin: 10px auto; margin-bottom: 20px; border-radius: 4px; background: rgb(59, 89, 152); font-size: 18px; border: none!important; cursor: pointer; text-shadow: 0px 0px 3px black; color: #fff; } .ABT_Widget_Container:before { content: ""; position: absolute; border-right: 15px solid transparent; border-left: 15px solid transparent; border-top: 15px solid rgb(59, 89, 152); border-bottom: 15px solid transparent; left: 50%; transform: translate(-50%); top: -1px; z-index: 55; } .ABT_Widget_Container{ position: relative } .ABT_formWrap, .ABT_innerForm, .ABT_Widget_Container { width: 100%; } .pulse { -webkit-animation: pulse .8s linear infinite; -moz-animation: pulse .8s linear infinite; -ms-animation: pulse .8s linear infinite; animation: pulse .8s linear infinite } .ABT_float_ads_close:before { content: ""; position: absolute; border-right: 9px solid #955f28; border-left: 5px solid transparent; border-top: 9px solid transparent; border-bottom: 5px solid #955f28; left: 6px; } @keyframes pulse { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } 50% { -webkit-transform: scale(0.8); -moz-transform: scale(0.8); -o-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(0.8) } 100% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } } @-moz-keyframes pulse { 0% { -moz-transform: scale(1); transform: scale(1) } 50% { -moz-transform: scale(0.8); transform: scale(0.8) } 100% { -moz-transform: scale(1); transform: scale(1) } } @-webkit-keyframes &quot; pulse&quot; { 0% { -webkit-transform: scale(1); transform: scale(1) } 50% { -webkit-transform: scale(0.8); transform: scale(0.8) } 100% { -webkit-transform: scale(1); transform: scale(1) } } @-ms-keyframes &quot; pulse&quot; { 0% { -ms-transform: scale(1); transform: scale(1) } 50% { -ms-transform: scale(0.8); transform: scale(0.8) } 100% { -ms-transform: scale(1); transform: scale(1) } } @media (max-width: 650px){ #ABT_float_ads_main_Wrap{ display: none!important; } }</style>
<div class='ABT_float_ads_main_Wrap' id='ABT_float_ads_main_Wrap'> <span class="ABT_Heading"><i class="pulse fa fa-heart fa-lg" aria-hidden="true"></i> Loved Our Blog Posts? </span> <span class="ABT_Heading2"><i class="fa fa-rss" aria-hidden="true"></i> Subscribe To Get Updates Directly To Your Inbox</span> <div class='ABT_float_ads_close'> <span id='ABT_close_button' style='float: right'> <i id='ABT_Close_Button' class="fa fa-times" aria-hidden="true" title='close the Advertisment'></i> </span> </div>
<div class='ABT_Widget_Container'>
<div class="ABT_formWrap">
<form class="ABT_innerForm" action='http://feedburner.google.com/fb/a/mailverify?uri=AllBloggerTricks' class='subscribe-form' method='post' onsubmit='window.open (&apos;http://feedburner.google.com/fb/a/mailverify?uri=AllBloggerTricks&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'> <div class='ABT_input_group'> <input class='ABT_Email' alt="Enter your email address:" placeholder="Enter your email address:" type="email" name="email" /> </div> <input type="hidden" value="AllBloggerTricks" name="uri" /> <input type="hidden" name="loc" value="en_US" /> <input class="button" type="submit" value="Subscribe" /> </form>
</div>
</div> <span id='ABT_credits' style='float: right; font-size: 12px; text-shadow: 0px 0px 3px black;'><a style='text-decoration: none!important; color: #fff;' href="http://www.allbloggertricks.com/2017/09/how-to-add-popup-email-subscription-form.html">Get This Widget</a></span>
<div style='clear:right'></div> </div>
<script type="text/javascript"> window.onload = function() { if(sessionStorage.getItem('closed')){ document.getElementById("ABT_float_ads_main_Wrap").style.display = 'none'; }else{ var ABT_closeButton = document.getElementById('ABT_close_button'); var ABT_float_ads_main_Wrap = document.getElementById("ABT_float_ads_main_Wrap"); myVar = setTimeout(function() { ABT_float_ads_main_Wrap.style.display = 'block' }, 3000); ABT_closeButton.onclick = function() { if(!sessionStorage.getItem('closed')){ sessionStorage.setItem('closed', 'true'); } document.getElementById("ABT_float_ads_main_Wrap").style.display = 'none'; } } }</script>
६- इस ट्यूटोरियल के बाद के लिए धन्यवाद अब अनुकूलन के लिए इसका समय है इसे अपनी साइट के लिए बनाने के लिए।


अनुकूलन:

👉 ऑरेंज हाइलाइटेड टेक्स्ट फ़ॉन्ट-भयानक स्टाइल-शीट के लिए ज़िम्मेदार है यदि आपने इस शैली-शीट को अपने ब्लॉग टेम्पलेट में पहले ही शामिल कर लिया है, तो कृपया इस Seript को अपने ब्लॉग में न जोड़ें।

👉 लाइट-ब्लू हाइलाइटेड टेक्स्ट आपके फीडबर्नर एड्रेस के लिए रिगिटला है। बस यलो हाइलाइट टेक्स्ट के हर इंस्टेंस को बदल दें और अपने फीडबर्नर एड्रेस को बदल दें।
७- सभी कार्य गैजेट को सहेजें और इसे अपनी साइट पर जांचें। निष्कर्ष: अंत में, हमने प्लगइन जोड़ा है। यदि आपको इस प्लगइन को स्थापित करने में कोई समस्या मिली, तो बेझिझक टिप्पणी करें मैं आपकी समस्या को हल करने में आपकी मदद करेगा

Contact & Join "Mech Guruji" (Me) At ...

E-Mail :- MechGurujee@Gmail.Com
YouTube :- https://YouTube.Com/MechGuruji
Twitter :- https://Twitter.Com/MechGuruji
Instagram :- https://Instagram.Com/MechGuruji
FaceBook :- https://FaceBook.Com/MechGuruji
Google+ :- https://Plus.Google.Com/+MechGuruji
👉MechGuruji...🇮🇳Vande Matram - Jai Hind🇮🇳

Post a comment

1 Comments

  1. This blog is really great. The information here will surely be of some help to me. Thanks!

    ReplyDelete