blogger me Contact Form page kaise banaye help hindi me.

blogger me Contact Form page kaise banaye help hindi me.

 

Namkar dosto

Dosto aaj is post me janege ki blog me contact Form page kaise banate hai. bolg ke lye contact from ka hona bahut jaruri hota hai taki users aapse joode rahe. 

contact form ke madad se apse direct contact kar  sake iske sath agar Aap apne blog par Google adsense ka Approve chahte ho to apke blog website par contact form ka page hona jaruri hai.

to chaliye jante hai contact form page kaise banate hai.

blogger me Contact Form page kaise banaye help hindi me.

Blog me contact form page kaise banaye 

Step 1

1 sabse pahle apne blog ke dashboard me jaye or layout par click kare

2 ab aap layout me kahi bhi  Add a widget par click kare

3 next Ad gadget par click kare.

4 next gadget me contact form par click kare.

5 ab save button par click karke gadget save kare 

Step 2

Ab apko apke blog ke dashboard me theme, Template ke option par click karke Edit HTML par click karna hai.

1 Ab HTML code box me kahi bhi click kare or Ctrl+F  dabaye or niche diya code search kare.

 

<b:widget id='ContactForm1'locked='false' title='Contact Form' type='ContactForm'>

Ya fir Aap jump widget par click kareke Contact Form1 ko bhi select kar sakte ho.

 

Step 3

1 next code ke site me arrow par click karke full size me code ko open kare.

2 ab next <b:includable id='main'> or </b:includable> 

ke bich me bhi code ata hai use delete kare taki Layout me contact form ka gadget apne liya hai oh hide ho sake taki blog ke home page me extra gadget show na kare.

<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 agar apko code dekh ke samaj nahi Aa raha hai uska screen shot deta hu taki apko kuch samjme aaye.

Step 4

1 Ab aap HTML code me Ctrl+F click karke ye code ]]></b:skin> search kare.

  

2 niche diya code is code  ]]></b:skin> ke upar past kare.

/* 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; }

Step 5

Ab apko blog ke dashboard jake pages ke option par click karke ek new page create kar leny hai. Main yeha par do tarah ke contact form ke bare me bata rah a hu apko jo Accha lage ise use kare.

1 blog ke dashboard me pages, new page par click kare.

2 ab niche diya gaya code page body me HTML par click karke ye code past kare.

<script>
var blogId = '875793694521573910';//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 par jake ye code past kare

4 code me jo id hai 875793694521573910 id ke jagah apne blog ki id set kare.

5 ab page ko publish kare  

dosto main apko contact form ka or ek code de raha oh bhi try kar sakte. use page me Html me past karna hai or page ko publish kar lena hai. ye code best hai.

<div class="widget ContactForm" id="ContactForm1">
<div class="contact-form-widget">
<div class="form">
<form name="contact-form">
<div class="fm_name">
Your Name:
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" /></div>
<div class="fm_email">
E-mail Address *:
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" /></div>
<div style="clear:both">
</div>
<div class="fm_message">
Message *:
<textarea class="contact-form-email-message" cols="25" 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" type="button" value="Submit" />
<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>
</div>
</div>
</div>

contact us page me code ko daalne ke baad page ko publish karde

dosto is contact form ke madase jo bhi apke blog par ayega or apse contact karna chahta hai to contact form ki madat se kar sakta hai.

Asha karta hu ki contact form ki jankari apko acchi lagi hogi.

agar apko samjme nahi aya ho sabse best tarika hai ki internet par aisi bahut sari websites hai jo aise pages free me banakar deti hai aap us website ki madadse bhi contact form bana sakte ho.

 

• Tweet
• Share
• Share
• Share
• Share

About Arvind bh

Hello Dosto mera nam arvind he or me ish website par hindi me apna knowlage share karta hu india se hu or india ke logo ke liye kuch help karna chahta hu agar apko hamari website pasand aayi ho to apne dosto ko jarur bataye hamare bare me adhik janne ke liye yahaclick kare.>>

Related Post