Blogger Me Contact Form Page Kaise Banaye Ki Jankari

क्या आप जानते है आपके blog में contact form होना बहुत जरुरी है जिससे आपके visitors, company owners आपसे direct contact कर सके अगर आप visitors को बार बार अपना email address नहीं बताना चाहते हो तो आप अपने blog में contact form add कीजिये ये बहुत ही अच्छा तरीका है visitors बढाने का blog में contact form add करने के लिए आपको बस थोड़ी सी coding setting करनी है इस article में आज मै आपको इसी का तरीका बता रहा हूँ अगर आप अपने blog में contact form बनाना चाहते है तो आप इस post को follow कीजिये।

 contact form

Blogger में Contact Form Page कैसे Add करते है?

Step 1:

1. अपने blog के dashboard में जाये और layout पर click करें।
2. अब आप कहीं भी Add a Widget पर click करें।
select contact forum
1. More Gadgets option पर click कीजिये।
2. Contact Form पर click कीजिये।
3. अब save button पर click करें।

Step 2:

अब अपने blog के dashboard >> Template >> Edit HTML पर जाये।
1. अब आप code box में कहीं भी click कर के Ctrl+F दबाये और ये code search करें।
 <b:widget id='ContactForm1' locked='false' title='Contact Form' type='ContactForm'>
या फिर आप Jump to Widget पर click कर के ContactForm1 पर click करें।
jump to contact forum

Step 3:

1. code के left side में arrow पर click कर के full code open कीजिये।
 click code arrow

2. अब <b:includable id='main'> और </b:includable> के बीच में जो code है उसे delete कर दीजिए।

<b:if cond='data:title != ""'>
<h2 class='title'>
<data:title/></h2>
</b:if>
<div class='contact-form-widget'>
<div class='form'>
<form name='contact-form'>
 <p/>
 <data:contactFormNameMsg/> 
 <input class='contact-form-name' expr:id='data:widget.instanceId + "_contact-form-name"' name='name' size='30' type='text' value=''/>
 <p/>
 <data:contactFormEmailMsg/> <span style='font-weight: bolder;'>*</span> 
 <input class='contact-form-email' expr:id='data:widget.instanceId + "_contact-form-email"' name='email' size='30' type='text' value=''/>
 <p/>
 <data:contactFormMessageMsg/> <span style='font-weight: bolder;'>*</span> 
 <textarea class='contact-form-email-message' cols='25' expr:id='data:widget.instanceId + "_contact-form-email-message"' name='email-message' rows='5'/>
 <p/>
 <input class='contact-form-button contact-form-button-submit' expr:id='data:widget.instanceId + "_contact-form-submit"' expr:value='data:contactFormSendMsg' type='button'/>
 <p/>
<div style='text-align: center; max-width: 222px; width: 100%'>
</div>
</form>
</div>
</div>
<b:include name='quickedit'/>
3. अगर आपको ये coding समझ न आये तो आप इस image को follow कीजिये।
contact forum example

Step 4:

  1. अब आप ]]></b:skin> ये code search कीजिये।
  2. ये code copy कर के ]]></b:skin> के ऊपर paste करें।
/* Contact smi*/
.contact-form-widget {
margin-left:auto;
margin-right:auto;
width: 400px;
max-width: 50%;
padding: 0px;
color: #000;
}
.fm_name, .fm_email {
float:left;
padding:5px;
width:48%
}
.fm_message {
padding:5px;
}
.contact-form-name, .contact-form-email {
width: 50%;
max-width: 50%;
margin-bottom: 10px;
height:30px;
padding:10px;
font-size:16px;
}
.contact-form-email-message {
width:100%;
max-width: 80%;
height:200px;
margin-bottom:10px;
padding:10px;
font-size:16px;
}
.contact-form-button-submit {
border-color: #f9f9f9;
background: #1aeb00;
color: #222;
width: 100%;
max-width: 20%;
margin-bottom: 10px;
height:30px;
font-size:16px;
}
.contact-form-button-submit:hover{
background: #f56c7e;
color: #444;
border: 2px solid #222;
}
3. Save Template पर click करें।

Step 5:

अब आपको new page बनाना है मै आपको यहाँ पर दो तरह के contact forum बता रहा हूँ आपको जो अच्छा लगे आप उसे follow कीजिये।
1. Blog के dashboard >> Pages >> New Page पर click करें।
create new page

2. अब ये code copy करें।

<script>
var blogId = '9068543364951090862';//replace it the text with your blogID
//The below message 5 Strings can also be edited
var contactFormMessageSendingMsg ='Sending...';
var contactFormMessageSentMsg = 'Your message has been sent.';
var contactFormMessageNotSentMsg = 'Message could not be sent. Please try again later.';
var contactFormEmptyMessageMsg ='Message field cannot be empty.';
var contactFormInvalidEmailMsg = 'A valid email is required.'
var widgetLoaded=false;
function sendEmailMsg() {
if(widgetLoaded== false) {
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'sidebar', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': contactFormMessageSendingMsg , 'contactFormMessageSentMsg': contactFormMessageSentMsg , 'contactFormMessageNotSentMsg': contactFormMessageNotSentMsg , 'contactFormInvalidEmailMsg': contactFormInvalidEmailMsg , 'contactFormEmptyMessageMsg': contactFormEmptyMessageMsg , 'title': 'Contact Form', 'blogId': blogId, 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));
widgetLoaded=true;
document.getElementById('ContactForm1_contact-form-submit').click();
}
return true;
}
</script>
<form name="contact-form">
<div>
Your Name : </div>
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />
<div>
Your Email: <em>(required)</em></div>
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />
<div>
Your Message: <em>(required)</em></div>
<textarea class="contact-form-email-message" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>
<input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" onclick="sendEmailMsg()" type="button" value="Send" />
<div style="max-width: 450px; text-align: center; width: 100%;">
<div class="contact-form-error-message" id="ContactForm1_contact-form-error-message">
</div>
<div class="contact-form-success-message" id="ContactForm1_contact-form-success-message">
</div>
</div>
</form>
3. HTML पर click कर के code paste कर दे।
4. code paste करने के बाद9068543364951090862 ID की जगह अपने blog की id set करे और page publish कर दे।

इस post को समझने में अगर आपको किसी तरह की problem आती है तो आप मुझे comment में बता सकते है मुझे आपकी help करने में बड़ी खुशी होगी।

अगर आपको blogger या internet से related कोई भी जानकारी चाहिए तो मुझे comment में post कर सकते है साथी ही आप अपने browser में https://www.supportmeindia.com type कर के भी हमारी website पर आ सकते है।

I hope आपको ये post आपको अच्छी लगी होगी अगर हाँ तो इसे अपने सभी friends के साथ social media पर share जरुर करना ताकि आपकी वजह से कोई और भी अपने blogger blog में Contact Form Page add कर सके।

Continue Reading
Avatar for Jumedeen Khan

by: Jumedeen Khan

मैं इस ब्लॉग का संस्थापक और एक पेशेवर ब्लॉगर हूं। यहाँ पर मैं नियमित रूप से अपने पाठकों के लिए उपयोगी और मददगार जानकारी शेयर करता हूं। ❤️

100 Comments

Comments ( 100 )

  1. nmskar sir,
    sir mera naam sandeep hai
    aur mein aapka tahdil se shukr gujaar hoon ki aapne contact form kr baare mein artical likha

    sir meri problem ye hai ki
    maine ek blog bnaaya hai

    uspe contact form mein problem hai
    kabhi to submit ka button nhi show aur agr button show ho jaaye to submit nhi ho pata

    maine aapke is artical mein btaaye sabhi articals follow kiye hai but fir bhi submit nhi ho pa rhaa

    kya kroon sir ji
    kuch help kijiye
    please:::::

    Reply
  2. sir g mera msg box bangya he bahar par msg andar nhi dikha rha he plz btaye

    Reply
  3. Bina kisi coding me bhi contact us page add hoga bro Maine kiya h but blog me show nhi kar RHA h view VEB version me show kar RHA hai bataiye sir jee ye kaise show karega.

    Reply
  4. is post me Jo jankari h bahut achhi h but ek baat samajh se bahar h ki agar koi message karega to message kis email I'd par jayega jisase blog banaya hai ya kisi or par

    Reply
    • Blogger wali ID par

      Reply
  5. jumeedeen ji
    me apni site par login and signup button lagana chahta huu..
    codes mene generate kar liya ab blogger me kaise lagana hai...doubt in html setting,,,,help please i waiting your answers

    Reply
    • Dear shersingh ji I am not a developer. Aap kisi coding expert se is bare me bat kare.

      Reply
  6. भाई जो आप आप डिप्रेसन में प्रोफाइल में अबाउट लिखे हो मेरा नाम ये है मै एक इंडियन ब्लॉगर हु वो कैसे लगेगा हमारे ब्लॉग में

    Reply
  7. maine aapke btaye anusar contact form add kr liya hai, magar koi form se messege karta hai to mujhe wo messege nhi milta .... solution btaiye ?

    Reply
  8. sir jaise aapki website ki id ye hai ,
    9068543364951090862 ID
    to sir mere blog ki id ka kaise pata chalega

    Reply
    • Apne blog ke dashboard me jao or browser ke link boxx me dekho "blogID=8275315283777885478" type ki ID hogi wo blog id hoti hai.

      Reply
  9. thankyou sir ye post mere liye bahut helpful rahi

    Reply
  10. bhai , apne jo skin ke bad wala code diya hai wo copy nahin ho raha hai aur aur wo code skin ke niche ya upar kahan pe paste karna hai ?

    Reply
    • Ab copy karo ho jayega or skin se pahle yani upar code add karna hai.

      Reply
      • Thank you bhai .
        contact form successfully add.

        Reply

Leave a Comment

BlogSpot

Blogger Me Default Hyperlink Color Kaise Use Kare

Default hyperlink color
Blogger में Default Hyperlink Color कैसे Use करें। हर blogger अपने blog को सबसे अलग look देना चाहता है और हर blogger का सपना होता है अपने blog को बेहतर बनाना इसलिए आज इस post में मै आपको बताने जा रहा हूँ की "Blogger में Default Hyperlink color" कैसे use करते है।…
Continue Reading
BlogSpot

Blogger Blog Ki Security Ke Liye HTTPS Enable Kaise Kare

enable-blogspot-https-security
HTTPS blog ki data security ke liye ek acha tarika hai. kuch important jankari jaise paise transfer karna, forum bharna, personal data saving me https ki security baht jaruri hai. agar aap inme se ek hai to aapko https enble rakhna chahiye. agar aap blogspot user hai to aap apne blog…
Continue Reading
BlogSpot

Blogger Blog Ki Post Ko SEO Friendly Kaise Banaye 10 Killer Tips

Blogspot-Blog-10-Killer-tips-to-make-SEO-post
हम जब blog में new post लिखते है तो हमे इसकी पुरी जानकारी होनी चाहिए की किस तरह की post को search engine जल्दी show करता है। New blogger के लिए SEO friendly post लिखने की जानकारी बहुत ही जरुरी है क्य्युकी इससे हम किसी भी post से 40% और…
Continue Reading
t20 win
x