Email Subscribe Box कैसे Add करे? How Add Email Subscribe Widget Hindi?

Blog Website में Email Subscribe Box Widget Kaise Lagaye. blogger में email subscribe box widget लगाना बहुत जरुरी होता है. क्योंकि हम सभी जानते हैं,

visitor द्वारा Email subscribe करने पर हम content post को email द्वारा share किया जाता है. या उन लोगों तक email से content post पहुंचाया जाता है. जिसे visitors के पास email में notification आ जाता है. और post को पढ़ लेते हैं.

इसलिए हम आज Subscribe Box बनायेगे? और उसका सेटिंग अपने ब्लॉगर में set करेंगे. चलिए निचे देखते हैं-

Subscribe क्या है? कैसे काम करता है?

subscribers blog के लिए बहुत important है. visitors अपना email में free content post प्राप्त करने के लिए visitors को subscribe box में Name और email डालकर subscribe करना होता है।

फिर वह visitors का email हमारे पास आ जाता है. फिर हम कभी post को तैयार करते हैं. या और publish करते हैं. तब ईमेल से उन visitors के email में चला जाता है.

फिर visitors के पास email में notification आ जाता है और post को read करने के लिए हमारी website blog पर आ जाते हैं. जिससे old visitors हमारे blog से जुड़े रहता है.

और free post की जानकारी email के द्वारा प्राप्त कर सकता है. subscribes box लगाने के लिए हमें feedburner feed बनाने की जरूरत पड़ती हैं. feedburner feed बनाने के बाद ही आप subscribe box लगा पाएंगे. feedburner feed कैसे बनाएं पूरी जानकारी हिंदी में.

feedburner feed बनाने के बाद subscribe box लगाने के लिए नीचे बताएंगे step को follow करें.

Blogger में Email Subscribe Box के प्रकार

अपने ब्लॉगर में subscribe box 2 प्रकार से लगा सकते हैं-

1. Blogger में पहले से मौजूद email subscribe widget द्वारा
2. New HTML CODE द्वारा लगाकर email subscribed लगाना

Blogger में Email Subscribe Widget कैसे ADD करते हैं?

Blogger में subscribe box widget पहले से ही होता है। और अगर आप old subscribe widget लगाना चाहते हैं. तो देखिए किस प्रकार लगाते हैं.

1. blogger dashboard में जाए.
2. layout पर click करें फिर side में add a widget पर क्लिक करें.
3. add a widget पर क्लिक करते ही बहुत से widget दिखाई देंगे.
4. उसमें follow by email पर क्लिक करें.
5. उसके बाद एक popup window खुलेगी. तथा उसमें Title और feedburner URL डालना होगा.

• Title- यहां पर कुछ भी नाम डालें. जैसे- Follow by email या फॉलो जरूर करें आदि.
• feedburner URL- यहां पर आपका Feedburner URL डालें

6. फिर save बटन पर click करके save कर दें
7. save करने के बाद “save arrangement” पर क्लिक करें

अब आप blogger blog को open करके देखिए. आपका email subscribe follow लग चुका है.

इस प्रकार blogger में पहले से मौजूद subscribe widget add करके subscribe box लगा सकते हैं.

अगर आपको यह subscribe widget अच्छा नहीं लगा है. तो नीचे बताए गए अलग-अलग style में से अपने पसंद के HTML code से subscribe box widget blogger में add कर सकते हैं.

Style-1

Email Subscribe Box Blogger में कैसे Add करें?

1. blogger dashboard में जाए
2. theme/ template पर क्लिक करें
3. edit HTML पर click करें. (theme का backup जरूर लेे)
4. control +F दबाकर ]]></b:skin> यह कोड सर्च करें.
5. मिल जाने के बाद ]]></b:skin> के ऊपर नीचे बताए गए CSS code paste करें.

<div class="code">/* —————————————————- Subscription Box Widget RED Designed by : https://howhindi.com Do Not Remove this Credits. —————————————————–*/ #blog-ornate-subscribe { background: #f47555; padding: 26px; height:auto; position:relative;overflow:hidden;} #blog-ornate-subscribe h4.title { color: #FFFFFF; font-size: 22px; text-align: center; line-height: 1; margin-bottom: 0; text-transform: uppercase; margin-top:10px; } #blog-ornate-subscribe p { color: #FFFFFF; margin: 0; text-align: center; } #blog-ornate-subscribe p.text { opacity: 0.8; margin: 15px 0; } #blog-ornate-subscribe input { width: 100%; margin: 0; border: none; box-sizing: border-box; box-shadow: none; text-align: center; padding: 10px 0; height: 45px; border-radius: 0; } #blog-ornate-subscribe input.email-field { background: #F1F1F1 url(http://techornate.com/todev/images/email.png) no-repeat; background-position: 5px 14px !important; padding: 10px; border: 1px solid #CCC; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff; -webkit-box-shadow: 0 1px 1px #CCC inset, 0 1px 0 #FFF; box-shadow: 0 1px 1px #CCC inset, 0 1px 0 #FFF; } #blog-ornate-subscribe input:focus{ background-color: #FFF; border-color: #E8C291; outline: none; -moz-box-shadow: 0 0 0 1px #e8c291 inset; -webkit-box-shadow: 0 0 0 1px #E8C291 inset; box-shadow: 0 0 0 1px #E8C291 inset; } #blog-ornate-subscribe input:focus::-webkit-input-placeholder { color: transparent !important } #blog-ornate-subscribe input:focus::-moz-input-placeholder { color: transparent !important } #blog-ornate-subscribe input:focus:-moz-input-placeholder { color: transparent !important } #blog-ornate-subscribe input.submit { font-weight: 500; font-size: 18px; background: #FFFFFF; margin-top: 20px; text-transform: uppercase; color: #f47555; box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05); cursor: pointer; border: 1px solid #CCC; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } #blog-ornate-subscribe input.submit:hover{background:#f03636;color:#fff;}</div>

6. last me save Theme सेव कर दें.

इसके बाद एक और काम बाकी रह गया. वह है feedburner HTML subscribe box code blogger के sidebar में add करना.

ऊपर बताये गये स्टेप्स को करने के बाद यह स्टेप भी करें.

1. blogger dashboard में जाएँ
2. layout पर क्लिक करें
3. right side में add a widget पर क्लिक करें
4. next page per HTML / JavaScript पर क्लिक करें
5. फिर खाली बॉक्स में नीचे बताए गए code paste कर दें.

<!-- wp:paragraph -->
<p>&lt;div id=”blog-ornate-subscribe”&gt; &lt;h4 class=”title”&gt;Subscribe via Email&lt;/h4&gt; &lt;p class=”text”&gt;Don’t Miss Any Updates, Stay Connected!&lt;/p&gt; &lt;form action=”https://feedburner.google.com/fb/a/mailverify” method=”post” target=”popupwindow” onsubmit=”window.open(‘https://feedburner.google.com/fb/a/mailverify?uri=BlogOrnate’, ‘popupwindow’, ‘scrollbars=yes,width=550,height=520’);return true”&gt; &lt;input class=”email-field” name=”email” placeholder=”Enter email address” type=”text” /&gt; &lt;input type=”hidden” value=”<span style="color: #ff0000;">Howhindi</span>” name=”uri”/&gt; &lt;input type=”hidden” name=”loc” value=”en_US”/&gt; &lt;input class=”submit” value=”Sign Up Now” type=”submit” /&gt; &lt;/form&gt; &lt;/div&gt;</p>
<!-- /wp:paragraph -->

इस कोड में “howHindi” की जगह पर feedburner feed का नाम डालना है.

6. last में save पर click करें.

7. फिर से save arrangement पर क्लिक कर दे.

अब आप blog को Open करके देखिए. आपका email subscribe box लग गया हैं.

यह भी पढ़े:-

• Blogger Stylish Labels कैसे Add करें?
• Blogger Me HTML JavaScript कैसे Add करें हिंदी में
• Facebook popup like box blogger में कैसे Add करें

Style 2

Subscribe box widget Blogger में कैसे Add करें

1. Edit HTML में जाएँ. और edit HTML पर क्लिक करें.
2. control + F दबाकर ]]:</b:skin> कोड सर्च करें.
3. नीचे बताए गए CSS code को ]]:</b:skin> के ऊपर paste कर दे.

<div class="code">/*------- Stylish Sidebar Subscription Box Widget by Howhindi.com------*/<br>#howhindi-sub {<br>padding: 0;<br>margin: 0;<br>width: 100%;<br>border-radius: 1px; border: 0;<br>background: #ff6600;<br>}<br>#howhindi-sub .heading {<br>padding: 10px 10px 5px 10px;<br>font-family: "Oswald", sans-serif;<br>font-size: 30px; color: #FFF;<br>text-align: center;<br>margin: 0;<br>line-height:1.5;<br>}<br>#howhindi-sub .rssform {<br>padding: 0px 20px;<br>margin: 16px 0px -15px 0px;<br>color:#fff;<br>}<br>#howhindi-sub .rssform input {<br>padding: 8px;<br>font-size: 13px;<br>color:#fff;<br>font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;<br>font-weight: normal;<br>background:#cc5200;<br>width: 100%;<br>outline: none !important;<br>border: none;<br>border-radius: 1px;<br>box-sizing: border-box !important;<br>-moz-box-sizing:border-box;<br>}<br>#howhindi-sub .rssform .button {<br>background: #FFF;;<br>color:#cc5200!important;<br>border: 0;<br>margin-top: 15px;<br>outline: none !important;<br>transition: all .3s ease-in-out;<br>width: 100%;<br>padding: 6px !important;<br>float: none;<br>text-transform: uppercase;<br>font-family: "Oswald", sans-serif;<br>font-size: 18px;<br>font-weight: normal;<br>cursor: pointer;<br>}<br>#howhindi-sub .credit a {<br>color:#FFF;<br>text-align:center;<br>font-family: "Oswald",sans-serif;<br>text-decoration:none !Important;<br>}<br>#howhindi-sub .credit {<br>font-family: "Oswald",sans-serif;<br>text-align: center;<br>font-size: 12px;<br>padding: 0px;<br>line-height: 30px;<br>}</div>

4. last में save theme पर क्लिक करे.

यह हो गया आपका एक part complete. दूसरा part “add a widget” me CSS code डालना होगा. इसके लिए निचे दिए स्टेप follow करे.

ऊपर edit HTML में कोड डालने के बाद आगे नीचे बताए गए स्टेप्स फॉलो करें-

5. blogger dashboard में layout पर क्लिक करके Right Side में add a widget पर click कर दे.
6. फिर एक new page खुलेगा जिसमें HTML / JavaScript पर क्लिक कर दे.
7. नीचे दिए गए code को copy करके खाली बॉक्स में paste कर दे.

<div id='howhindi-sub'><div class='heading'>GET OUR LATEST POSTS IN YOUR INBOX</div> <div class='rssform'> <form action='http://feedburner.google.com/fb/a/mailverify' method='post' target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=howhindi', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"> <input type='text' name='email' placeholder='Enter your email address...' /> <input type="hidden" value="howhindi" name="uri"/> <input type="hidden" name="loc" value="en_US"/>
<input value="Subscribe Now" class="button" type="submit" />
</form>
</div>
<div class="credit">
<a href="https://howhindi.com/blogger-me-email-subscribe-box-kaise-add-kare">Get This Widget</a>
</div>
</div>

इस कोड में howHindi की जगह पर अपना feedburner address डाल दे. और Save करे.

8. Or save arrangement पर क्लिक करके Save कर दें.

यह भी पढ़े-

• Google Adsense Account कैसे बनाये? in Hindi
• Godaddy से Domain Name कैसे ख़रीदे? 2 Minutes में
• Blogger को बिना www के कैसे set करें?

अब Bloger को Open करके देखिए आपके blog में email subscribe box widget add हो गया है​.

उम्मीद करता हूँ, आपको email subscribe box कैसे लगाते हैं? blogger में sidebar में email subscribe कैसे ADD करते हैं? इसके बारे में समझ में आ गया होगा. अगर आपको कोई प्रॉब्लम आती है तो नीचे कमेंट करके सवाल जरूर पूछें. Social Media पर जरुर शेयर करें. Thank You.