Apne blog par contact us ka page kaise lagaye

Hamrari web site ka bahut important hissa contact us page kyoki hum apne visitor ko website ke owner ko sidhe milne moka milta hai.ye jaroori bhi hai isiliye ki ho sakta koi visitor apke kisi post par comment sujhav dena chahe.ye to hui contact form kyo jaroori hai to huma apko ab mai batata hu contact us page apne blogger me kaise lagaye.


CONTACT US PAGE BLOGGER ME KAISE LAGAYE-


Contact page ko blogger me lagane ke liye apko kuch step follw karne padenge jo niche diya hu.

STEP 1.sabse pahle aap blogger dashboard me jakar  add a gudget> contact form par jaye.

STEP 2.contact form save karne ke baad aap template section me edit html par click  kare.

STEP 3.ab apko jump to widget par click karke contact form 1 par click karna hai.

STEP 4. Ab apko arrow par click karke full code ko open kare example..

 <b:if cond='data:title != &quot;&quot;'>
 <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='contact-form-widget'>
   <div class='form'>
    <form name='contact-form'>
      <p/>
       <data:contactFormNameMsg/>
        <br/>
    <input class='contact-form-name' expr:id='data:widget.instanceId + &quot;_contact-form-name&quot;' name='name' size='30' type='text' value=''/>
   <p/>
  <data:contactFormEmailMsg/> <span style='font-weight: bolder;'>*</span>
   <br/>
  <input class='contact-form-email' expr:id='data:widget.instanceId + &quot;_contact-form-email&quot;' name='email' size='30' type='text' value=''/>
 <p/>
<data:contactFormMessageMsg/> <span style='font-weight:bolder;'>*</span>
 <br/>
 <textarea class='contact-form-email-message' cols='25' expr:id='data:widget.instanceId + &quot;_contact-form-email-message&quot;' name='email-message' rows='5'/>
    <p/>
  <input class='contact-form-button contact-form-button-submit' expr:id='data:widget.instanceId + &quot;_contact-form-submit&quot;' expr:value='data:contactFormSendMsg' type='button'/>
     <p/>
        <div style='text-align: center; max-width: 222px; width: 100%'>
          <p class='contact-form-error-message' expr:id='data:widget.instanceId + &quot;_contact-form-error-message&quot;'/>
          <p class='contact-form-success-message' expr:id='data:widget.instanceId + &quot;_contact-form-success-message&quot;'/>
        </div>
      </form>
    </div>
  </div>
  <b:include name='quickedit'/ 


STEP 4.is code ko mitana hai jo         ke bich hai.

STEP 5. mitane ke baad ctrl+f dabakar is code ko ]]></b:skin> code ko serch kare.

STEP 6.iske baad is code ke uper  ]]></b:skin>   ye code  paste kare jo mai niche diya hu.

/*Custom Cocntact Form BY sabhow.blogspot.com*/
.contact-form-widget {
margin-left:auto;
margin-right:auto;
width: 600px;
max-width: 100%;
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: 100%;
max-width: 100%;
margin-bottom: 10px;
height:40px;
padding:10px;
font-size:16px;
}
.contact-form-email-message {
width:100%;
max-width: 100%;
height:100px;
margin-bottom:10px;
padding:10px;
font-size:16px;
}
.contact-form-button-submit {
border-color: #C1C1C1;
background: #E3E3E3;
color: #585858;
width: 20%;
max-width: 20%;
margin-bottom: 10px;
height:30px;
font-size:16px;
}
.contact-form-button-submit:hover{
background: #ffffff;
color: #000000;
border: 1px solid #FAFAFA;
}



Ab aap template ko save kar de. save karne ke baad apko simple ek page apne blog me add karna hai. ISKE LIYE

STEP 1.apne blogger ke dashbord me jakar page page click kare.

STEP 2.add new page par click kare

STEP 3.page ka title CONTACT US, YA CONTACT ME dale.

STEP 4.ab hume page ke edit template me jakr ye code paste karna 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>


Sorce code-hmh.pe

STEP 5. iske bad aap apne page ko publish kar de. ab apka contact ka page bankar taiyar hai.

Kaisi lagi ye jankari hume bataye apka suggestion,comment is site par swagat hai.aur last me hamara FB page like karna n bhoole.

0 Comments