Search

Join this Blog for direct reference of any post into your inbox. To join just click on "Join this Site" under "Follower" then Login with your Email.*** DECLARATION: I Maintain this Blog for Helping Myself While at Work and Welcome any body Needing Help!!!.*** CAUTION: Using any of the script from this Blog may contain at Own Risk. These scripts May or May not have been Tested.***

Tuesday, 30 September 2014

Add Contact Form to a Specific Page with your Blogger‎

To add the Contact Form to specific page you have to add it first on the blogger column. If you already having the contact form on blogger layout then just ignore this steps.
  1. Sign in into your blogger dashboard and go to layout.
  2. Now click on “Add Gadget” link of “More Gadget”.
  3. Now find “Contact form” page element and click on it.
Now Create the New Contact Page where you want to add this page. Ignore the below steps if you have already created the contact page:
1. Create New Contact Page.
2. After Creating the page switch to HTML mode of the page.
3. Paste the below code in required position.
To add contact form into particular page you have to hide the official contact form from side bar. You can do this either removing the contact form code or adding some code to hide the contact form from side bar.
Go to the Template -> Edit HTML button and find this code: ]]></b:skin>

Then paste the below code above it:
#ContactForm1
{
display: none ! important;
}
or you can do one more things (if you don't want to paste above code.)
Switch to HTML mode and click on ‘options’ tab on the right side. Then select the “Use <br> tag” option in the Line Breaks section like below.

Then paste your Contact-Form Code:
<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>
<p></p>
<input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Send'/>
<div style='text-align: center; max-width: 450px; width: 100%'>
<p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
<p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
</div>
</form>
Then Finally Save the Template and check to send one message from your contact-Form.

0 comments:

Post a Comment