Sponsor

banner image

recent posts

HOW TO MOVE CONTACT FORM TO YOUR DESIRED PAGE

How to move contact form to a specific page move contact form to a specific page

Contact form can be easily moved to a specific page by using the form tag. 1. In your HTML document, locate the contact form and insert the form tag. 2. Within the form tag, add the following attributes: 3. Within the contact form's input tag, specify the page where the contact form should be moved. For example, if you would like the contact form to be moved to the home page, insert the following within the input tag: If you are using blogger as your host, I will recommend you to follow the steps bellow; 1. Longin to your blogger account. 2. Click on blogger the go dashboard or your control panel. 3. Click on the navigation bar,then layout go to side bar and add Contact form. 4. Go back to your HTML click edit html on the drop down menu. 5. Search style in the b:skin[// on the opening or ending of b:skin if you wish and paste the css codes bellow and click save. 6. Finally go to pages and and add the code bellow on the page where you wish the code to appear. For me i recommend you to place it on the contact page so that people can send messages to you about the product that you are offering onto them. Provided that you are having problems let me know in the comments section bellow or you can contact me via WhatsApp via the contact page in order to get answered faster.NB: remember to add this tag for contact form before the closing head tag as shown in the diagram below.#contactform1{display:none;}

<div style="text-align: center;color: green;"> You can reach us by filling this form </div> <div class="contact-form-widget"> <div class="form"> <form name="contact-form"> <p></p> Name <br /> <input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" /> <p></p> Email <span style="font-weight: bolder;">*</span> <br /> <input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" /> <p></p> Message <span style="font-weight: bolder;">*</span> <br /> <textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea> <pgt;</p> <input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Send" /> <p></p> <div style="max-width: 222px; text-align: center; 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> </div> </div>
/* Style the form element with a border around it */ form { border: 4px solid #f1f1f1; } /* Add some padding and a grey background color to containers */ .container { padding: 20px; background-color: #f1f1f1; } /* Style the input elements and the submit button */ input[type=text], input[type=submit] { width: 100%; padding: 12px; margin: 8px 0; display: inline-block; border: 1px solid #ccc; box-sizing: border-box; } /* Add margins to the checkbox */ input[type=checkbox] { margin-top: 16px; } /* Style the submit button */ input[type=submit] { background-color: #04AA6D; color: white; border: none; } input[type=submit]:hover { opacity: 0.8; }
HOW TO MOVE CONTACT FORM TO YOUR DESIRED PAGE HOW TO MOVE CONTACT FORM TO YOUR DESIRED PAGE Reviewed by Boniface on December 27, 2022 Rating: 5

No comments:

Let me know what you think in the comments section bellow

Powered by Blogger.