{"id":9226,"date":"2021-06-28T05:42:58","date_gmt":"2021-06-28T05:42:58","guid":{"rendered":"https:\/\/www.icdsoft.com\/blog\/?p=9226"},"modified":"2025-08-19T09:56:45","modified_gmt":"2025-08-19T09:56:45","slug":"how-to-make-a-great-contact-page","status":"publish","type":"post","link":"https:\/\/www.icdsoft.com\/blog\/how-to-make-a-great-contact-page\/","title":{"rendered":"How to Make a Great Contact Page"},"content":{"rendered":"\n<p>Up-to-date content, great layout and easy navigation are some of the most important features you should have on your website. There is one more thing you should pay attention to, though. If a visitor has a question, they will look for a Contact page to get in touch with you. Whether they will stay on the site after that and whether they will order from you may well depend on their experience on that page.<\/p>\n\n\n\n<p>Here are a few tips that will help you create a great Contact page:<\/p>\n\n\n\n<div class=\"wp-block-advgb-summary alignnone\"><div class=\"advgb-toc-header collapsed\">How to Make a Great Contact Page<\/div><ul class=\"advgb-toc alignnone\" style=\"display:none\"><li class=\"toc-level-2\"><a href=\"#make-it-easy-to-find-3367c766-0de4-46ab-b7bd-f7513610b3a0\">Make it easy to find<\/a><\/li><li class=\"toc-level-2\"><a href=\"#keep-it-simple-b8ca555f-5c18-43d2-b66c-1d5b88dd750b\">Keep it simple<\/a><\/li><li class=\"toc-level-2\"><a href=\"#add-an-address-and-a-map-e276e9c0-fdd7-46c9-b192-c88920c4f8b0\">Add an address and a map<\/a><\/li><li class=\"toc-level-2\"><a href=\"#add-multiple-points-of-contact-dee22733-8357-4cc5-8a93-6255968e377f\">Add multiple points of contact<\/a><\/li><li class=\"toc-level-3\"><a href=\"#add-a-live-chat-77b85697-1a8b-4711-a4ec-22ec8f5dff7c\">Add a live chat<\/a><\/li><li class=\"toc-level-2\"><a href=\"#add-a-contact-form-0cb9e1b7-702f-4c4c-8cf9-f78f5443d3e1\">Add a contact form<\/a><\/li><li class=\"toc-level-2\"><a href=\"#present-your-team-b1c077c2-14ef-4279-8b21-17df91481de6\">Present your team<\/a><\/li><li class=\"toc-level-2\"><a href=\"#add-social-media-buttons-e1f9e61b-4a1f-43bd-8723-fb24062035b5\">Add social media buttons<\/a><\/li><li class=\"toc-level-2\"><a href=\"#links-to-faq-f868a8f0-56e3-4daf-94b5-cf486b089220\">Links to FAQ<\/a><\/li><li class=\"toc-level-2\"><a href=\"#how-to-add-a-contact-form-13e96209-db21-4f6e-813c-27797b70503f\">How to add a contact form?<\/a><\/li><li class=\"toc-level-2\"><a href=\"#in-conclusion-78227315-504c-4b8f-a1e8-a5a14bc8b63c\">In conclusion<\/a><\/li><\/ul><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"make-it-easy-to-find-3367c766-0de4-46ab-b7bd-f7513610b3a0\">Make it easy to find<\/h3>\n\n\n\n<p>It won\u2019t really matter what you have on the Contact page of your website if visitors cannot find it. This is why, you should make sure that anybody who wants to contact you, can actually reach the page with ease.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignright size-large is-resized\"><img decoding=\"async\" width=\"498\" height=\"176\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact1.png\" alt=\"Dropdown menu under Company showing links to Why ICDSoft? and Contacts with a cursor pointing to Contacts.\" class=\"wp-image-9230 lazyload\" style=\"--smush-placeholder-width: 498px; --smush-placeholder-aspect-ratio: 498\/176;width:348px;height:123px\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact1.png 498w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact1-300x106.png 300w\" data-sizes=\"(max-width: 498px) 100vw, 498px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" \/><\/figure>\n<\/div>\n\n\n<p>A link to the Contact page is usually placed at the top (main menu or first-level submenu) or at the bottom of a website. This is where people will look if they want to find that page. Adding a link on the sides of the website or on some internal page will make it harder for your visitors to get in touch with you.<\/p>\n\n\n\n<p>Do not give the page some witty name. You should stick to conventional names - use \u201cContact Us\u201d or \u201cSupport\u201d, for example. While site layouts and navigation menus have evolved through the years, the Contact page is one of the few things that have remained constant. People are very used to a handful of names for such a page and they will not appreciate a change.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"keep-it-simple-b8ca555f-5c18-43d2-b66c-1d5b88dd750b\">Keep it simple<\/h3>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignright size-large is-resized\"><img decoding=\"async\" width=\"358\" height=\"797\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact2.png\" alt=\"ICDSoft Contact Options: Email Us, Live Chat, Post Ticket for Support and Assistance\" class=\"wp-image-9232 lazyload\" style=\"--smush-placeholder-width: 358px; --smush-placeholder-aspect-ratio: 358\/797;width:198px;height:440px\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact2.png 358w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact2-135x300.png 135w\" data-sizes=\"(max-width: 358px) 100vw, 358px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" \/><\/figure>\n<\/div>\n\n\n<p>Any page on your website should have the same layout and the same branding as the rest of the site, including the Contact page. You should make sure that you do not add too much clutter to the page. Below, you will find more information about the things you should definitely have, but you should avoid adding irrelevant text, images, or anything else that is not related to a channel of communication you offer. Advertisements on the Contact page are a big no-no. Make sure that you have a functional and useful page.<\/p>\n\n\n\n<p>Naturally, you should make sure that the Contact page on your site is responsive so that people can contact you on any device, if needed. Having irrelevant information on the page will only make it look bad on a mobile device.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"add-an-address-and-a-map-e276e9c0-fdd7-46c9-b192-c88920c4f8b0\">Add an address and a map<\/h3>\n\n\n\n<p>People usually like to see a physical address on a Contact page. It gives them more confidence in the website they are browsing. Depending on the site, this could be an office or a restaurant location, a company registration address, etc. If you offer any goods or services, for example, it is more likely to make a sale online if people see that you have a physical office\/shop, even if they cannot visit it. If they see only an email address or a phone number, but no physical address, they may have doubts about placing an order.<\/p>\n\n\n\n<p>Of course, if you add an address, it is good to have an in-page map as well. It will make it easier for people to find you as they will not have to go to a third-party map platform, leaving your site. There are different ways to do that.<\/p>\n\n\n\n<p>If you use our Website builder, it will feature a map on the contact page by default, displaying an address of your choice. Adding a map on another page or changing the address displayed on it is really easy.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"204\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact3-1024x204.png\" alt=\"Map of San Francisco highlighting Potrero Hill and nearby locations; marked address is 123 Street, Suite 600.\" class=\"wp-image-9236 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact3-1024x204.png 1024w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact3-300x60.png 300w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact3-1536x307.png 1536w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact3.png 1758w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/204;\" \/><\/figure>\n<\/div>\n\n\n<figure class=\"wp-block-gallery aligncenter has-nested-images columns-default is-cropped wp-block-gallery-1 is-layout-flex wp-block-gallery-is-layout-flex\">\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"632\" height=\"866\" data-id=\"9240\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact4-1.png\" alt=\"An old pencil drawing of Don Quixote and Sancho Panza sitting on their horses, by Wilhelm Marstrand.\" class=\"wp-image-9240 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact4-1.png 632w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact4-1-219x300.png 219w\" data-sizes=\"(max-width: 632px) 100vw, 632px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 632px; --smush-placeholder-aspect-ratio: 632\/866;\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"604\" height=\"705\" data-id=\"9238\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact5.png\" alt=\"Dashboard showing module options including add to Google, gallery, map, slider, and voting poll with search bar.\" class=\"wp-image-9238 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact5.png 604w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact5-257x300.png 257w\" data-sizes=\"(max-width: 604px) 100vw, 604px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 604px; --smush-placeholder-aspect-ratio: 604\/705;\" \/><\/figure>\n<\/figure>\n\n\n\n<p>If you want to add a Google map, you should follow the steps to create a Google Maps API key:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Log in with your Google account at <a href=\"https:\/\/console.cloud.google.com\" target=\"_blank\" rel=\"noreferrer noopener\">Google Cloud Platform Console<\/a><\/li>\n\n\n\n<li>Go to API Project -> New Project.<\/li>\n\n\n\n<li>On the left, select APIs and Services -> Credentials -> Create credentials -> API Key<\/li>\n<\/ul>\n\n\n\n<p>Depending on the type of map you want to use (static, dynamic, Street view), you will have to pay between $2 and $7 per 1000 requests. This shouldn\u2019t discourage you, though, as <em>Google gives $200 per month to all its users for API access<\/em>, which is more than enough for any small to medium-sized website.<\/p>\n\n\n\n<figure class=\"wp-block-gallery aligncenter has-nested-images columns-default is-cropped wp-block-gallery-2 is-layout-flex wp-block-gallery-is-layout-flex\">\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"678\" height=\"549\" data-id=\"9243\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact6-1.png\" alt=\"Google Cloud Platform New Project page with project and location fields, create and cancel options.\" class=\"wp-image-9243 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact6-1.png 678w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact6-1-300x243.png 300w\" data-sizes=\"(max-width: 678px) 100vw, 678px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 678px; --smush-placeholder-aspect-ratio: 678\/549;\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"785\" height=\"419\" data-id=\"9245\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact7-1.png\" alt=\"Google Cloud Console screen displaying options for creating API keys and OAuth credentials in a project.\" class=\"wp-image-9245 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact7-1.png 785w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact7-1-300x160.png 300w\" data-sizes=\"(max-width: 785px) 100vw, 785px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 785px; --smush-placeholder-aspect-ratio: 785\/419;\" \/><\/figure>\n<\/figure>\n\n\n\n<p>You will find the complete code for adding a map to any page here: <a href=\"https:\/\/developers.google.com\/maps\/documentation\/javascript\/adding-a-google-map\" target=\"_blank\" rel=\"noreferrer noopener\">Adding a Google Map with a Marker to Your Website<\/a>. The pricing depending on the map type is listed here: <a href=\"https:\/\/cloud.google.com\/maps-platform\/pricing\" data-type=\"URL\" data-id=\"https:\/\/cloud.google.com\/maps-platform\/pricing\" target=\"_blank\" rel=\"noopener\">Pricing &amp; Plans<\/a>.<\/p>\n\n\n\n<p>If you would like to see what the map looks like as you edit the code, you can use the <a href=\"https:\/\/developers.google.com\/maps\/documentation\/javascript\/adding-a-google-map#try-sample\" data-type=\"URL\" data-id=\"https:\/\/developers.google.com\/maps\/documentation\/javascript\/adding-a-google-map#try-sample\" target=\"_blank\" rel=\"noreferrer noopener\">JSFiddle online testing IDE<\/a>.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"485\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact8-1024x485.png\" alt=\"HTML, CSS, JS code for Google Maps API displaying a map centered on Uluru, Australia with a custom marker.\" class=\"wp-image-9246 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact8-1024x485.png 1024w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact8-300x142.png 300w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact8-1536x728.png 1536w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact8.png 1634w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/485;\" \/><\/figure>\n<\/div>\n\n\n<h3 class=\"wp-block-heading\" id=\"add-multiple-points-of-contact-dee22733-8357-4cc5-8a93-6255968e377f\">Add multiple points of contact<\/h3>\n\n\n\n<p>A Contact page should indeed be a contact page i.e. it should allow the site visitors to contact you directly through the page and to see different communication channels. Some people may like talking on the phone, others may prefer to use a live chat. Limiting the contact options may have a negative impact on your website as people who do not see their preferred communication channel may go to another website. Vice versa, offering multiple ways to contact you can increase your conversion rates as happy customers tend to order more.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"add-a-live-chat-77b85697-1a8b-4711-a4ec-22ec8f5dff7c\">Add a live chat<\/h4>\n\n\n\n<p>There are different services that allow you to add a live chat to your website without installing any additional software. While you can use any of them, two of the more popular options are Tawk.to and Facebook Messenger.<\/p>\n\n\n\n<p>To add a <a href=\"https:\/\/www.tawk.to\/\" target=\"_blank\" rel=\"noreferrer noopener\">Tawk.to<\/a> chat, you have to sign up on their website for free. You have to enter your site name and URL, and you will have the option to copy the Tawk.to widget code if you want to add the live chat to your site. Our Website builder, for example, comes with a Tawk.to module, so you just have to paste the code in it and the chat will appear on your site. Alternatively, if you use WordPress, OpenCart, Prestashop, WHMCS or Shopify, you will find a plugin download link for each one of these platforms on the same page.<\/p>\n\n\n\n<figure class=\"wp-block-gallery aligncenter has-nested-images columns-default is-cropped wp-block-gallery-3 is-layout-flex wp-block-gallery-is-layout-flex\">\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"664\" data-id=\"9248\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact9-1-1024x664.png\" alt=\"Tawk.to chat widget setup screen with widget name, code, status, and appearance settings displayed.\" class=\"wp-image-9248 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact9-1-1024x664.png 1024w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact9-1-300x195.png 300w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact9-1.png 1213w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/664;\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"726\" height=\"489\" data-id=\"9250\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact10-1.png\" alt=\"Tawk.to Live Chat dashboard interface with settings, widget code entry area, and green parrot illustration.\" class=\"wp-image-9250 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact10-1.png 726w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact10-1-300x202.png 300w\" data-sizes=\"(max-width: 726px) 100vw, 726px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 726px; --smush-placeholder-aspect-ratio: 726\/489;\" \/><\/figure>\n<\/figure>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"544\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact12-1024x544.png\" alt=\"Web page interface with Hello World message and chat support window with options to start a new conversation.\" class=\"wp-image-9252 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact12-1024x544.png 1024w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact12-300x159.png 300w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact12-1536x815.png 1536w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact12.png 1652w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/544;\" \/><\/figure>\n<\/div>\n\n\n<p>To add Messenger to your site, <a href=\"https:\/\/www.facebook.com\/\" data-type=\"URL\" data-id=\"https:\/\/www.facebook.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">log in to your Facebook account<\/a>, select the Page in question and go to Settings -&gt; Messaging. You will see an option \u201cAdd Messenger to your website\u201d, so you just have to follow the steps. Select a language, add a domain, copy the code you need and paste it to your site, edit the chat Welcome message if needed, and you will be all set. To add Messenger in our Website Builder, you can add a Custom HTML module and paste the code in it. For WordPress, add the Facebook chat plugin. If you use a different platform like Wix or Shopify, you can follow the instructions listed here: <a href=\"https:\/\/www.facebook.com\/business\/help\/1524587524402327\" target=\"_blank\" rel=\"noreferrer noopener\">Add Facebook chat plugin to your website<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-gallery aligncenter has-nested-images columns-default is-cropped wp-block-gallery-4 is-layout-flex wp-block-gallery-is-layout-flex\">\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"486\" data-id=\"9254\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact11-1024x486.png\" alt=\"Facebook Chat Plugin Setup Page with Editable Website Domain and Customization Options\" class=\"wp-image-9254 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact11-1024x486.png 1024w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact11-300x142.png 300w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact11-1536x729.png 1536w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/486;\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"580\" data-id=\"9255\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact13-1024x580.png\" alt=\"WordPress default Hello world! post with website name and Facebook Messenger chat widget for user login and guest access.\" class=\"wp-image-9255 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact13-1024x580.png 1024w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact13-300x170.png 300w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact13.png 1477w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/580;\" \/><\/figure>\n<\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"add-a-contact-form-0cb9e1b7-702f-4c4c-8cf9-f78f5443d3e1\">Add a contact form<\/h3>\n\n\n\n<p>Some people avoid talking on the phone (especially if you do not have a local phone number), others may not be able to log in to their personal mailbox to send you a message. A contact form will allow people to get in touch with you while they are on your site. Here are a few things you should look for, but remember that you need a simple and effective form, not a fancy and useless one.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Ask only for relevant information<\/strong>. You do not have to ask for an address or anything else apart from the name and the email address or the phone number of the site visitors if you have a contact form for general questions. The more information you ask for, the less likely it will be for people to use the form. This is especially true for people who visit your website on their smartphone\/tablet, as it will be even harder for them to fill multiple boxes.<\/li>\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Add a few categories of questions\/issues.<\/strong> It will be much easier and less time consuming for people to select one or a few categories from drop-down menus instead of describing their whole issue\/question. Be careful not to add too many options, though.<\/li>\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Use a good Send button. <\/strong>While the usual \u201cSubmit\u201d is standard for most forms, using something different may be more tempting for the site visitors and it may be more likely for them to contact you. A couple of good examples we have seen online are \u201cTalk to a human\u201d and \u201cAsk the Support Team\u201d.<\/li>\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Show people how and when you will respond.<\/strong> This is something few sites do and it is something people will definitely appreciate. Telling people when you will respond and in what way, will increase their trust in you and will save you future queries from them in case that they have not received a reply after some time. Whether you will reply in a couple of hours or a couple of days, it is important to be honest and to write a realistic response time.<\/li>\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Always display a Thank you message.<\/strong> There isn\u2019t much to say here. People will appreciate the courtesy.<\/li>\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Add an anti-bot system<\/strong>. You can add CAPTCHA, reCAPTCHA, hCaptcha or any similar solution that will prevent your contact form from being abused by spammers and automatic bots.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"present-your-team-b1c077c2-14ef-4279-8b21-17df91481de6\">Present your team<\/h3>\n\n\n\n<p>Adding a picture of you and your team always pays off. Few contact pages have pictures, or have just stock photos, so using a real one will make your website stand out. You will show your human face and this is something people will definitely appreciate. Of course, the main point of the Contact page is to allow visitors to get in touch with you and not to replace your About page, so a small picture will suffice.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"add-social-media-buttons-e1f9e61b-4a1f-43bd-8723-fb24062035b5\">Add social media buttons<\/h3>\n\n\n\n<p>When people come across a website, they often look for social media buttons to see if the site owner\/company is active and to check reviews. While there isn\u2019t a standard where social buttons should be, you will often find a few small buttons on the bottom of a website and larger ones to multiple social media on the Contact page.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1024\" height=\"283\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact18-1024x283.png\" alt=\"Social media buttons for Facebook, Instagram, Twitter, LinkedIn, and YouTube on a company website&#039;s follow us section.\" class=\"wp-image-9266 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact18-1024x283.png 1024w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact18-300x83.png 300w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact18.png 1415w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/283;\" \/><figcaption class=\"wp-element-caption\">Our Website Builder allows you to add social media buttons with a click<\/figcaption><\/figure>\n<\/div>\n\n\n<h3 class=\"wp-block-heading\" id=\"links-to-faq-f868a8f0-56e3-4daf-94b5-cf486b089220\">Links to FAQ<\/h3>\n\n\n\n<p>Having a well-structured and rich FAQ section can save you and your visitors a lot of time. If people can find the information they need right away, they will not need to contact you and you will not have to reply. There are different ways you can go about that depending on the contact form you have and your personal preference \u2013 a link to the FAQ page on your site, a few questions and answers below the contact form, or in-line search results that appear in the contact form subject box as people type their question.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"how-to-add-a-contact-form-13e96209-db21-4f6e-813c-27797b70503f\">How to add a contact form?<\/h3>\n\n\n\n<p>If you use our <a href=\"https:\/\/www.icdsoft.com\/en\/website-builder\" target=\"_blank\" data-type=\"URL\" data-id=\"https:\/\/www.icdsoft.com\/en\/website-builder\" rel=\"noreferrer noopener\">Website Builder<\/a>, your website will feature a contact page by default. The page will include the company name, address and phone number you have entered during the site setup. You will also find a contact form that you can customize \u2013 select what fields to appear and whether they should be required, add radio buttons, drop-down menus, a calendar or an upload button, or add a verification code to make sure that automatic bots will not abuse the form. Below the form, you will see a map displaying the company address. If needed, you can change the address you have entered previously, and choose a different zoom level.<\/p>\n\n\n\n<figure class=\"wp-block-gallery aligncenter has-nested-images columns-default is-cropped wp-block-gallery-5 is-layout-flex wp-block-gallery-is-layout-flex\">\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"936\" height=\"881\" data-id=\"9258\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact14-1.png\" alt=\"Form builder dialog for field properties with options for label, validation, and required toggle.\" class=\"wp-image-9258 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact14-1.png 936w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact14-1-300x282.png 300w\" data-sizes=\"(max-width: 936px) 100vw, 936px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 936px; --smush-placeholder-aspect-ratio: 936\/881;\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"932\" height=\"878\" data-id=\"9260\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact15-1.png\" alt=\"Form builder interface with fields for full name, email, subject, and message, plus options to add elements.\" class=\"wp-image-9260 lazyload\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact15-1.png 932w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact15-1-300x283.png 300w\" data-sizes=\"(max-width: 932px) 100vw, 932px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 932px; --smush-placeholder-aspect-ratio: 932\/878;\" \/><\/figure>\n<\/figure>\n\n\n\n<p>For WordPress, we recommend using the <a href=\"https:\/\/wordpress.org\/plugins\/contact-form-7\/\" target=\"_blank\" rel=\"noreferrer noopener\">Contact form 7<\/a> plugin. There are lots of plugins in the WordPress repository, but this one is by far the most popular one. You can create multiple contact forms, selecting their fields and layout, and then add them to any page by copying a simple shortcode. You can read more about the form here: <a href=\"https:\/\/contactform7.com\/faq\/\" target=\"_blank\" rel=\"noreferrer noopener\">Contact Form 7 FAQ<\/a>. Other popular plugins are <a href=\"https:\/\/wordpress.org\/plugins\/wpforms-lite\/\" target=\"_blank\" rel=\"noreferrer noopener\">WPForms<\/a> and <a href=\"https:\/\/wordpress.org\/plugins\/ninja-forms\/\" target=\"_blank\" rel=\"noreferrer noopener\">Ninja Forms<\/a>.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignright size-large is-resized\"><img decoding=\"async\" width=\"1024\" height=\"588\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact17-1024x588.png\" alt=\"Drupal admin page for adding a contact form with fields for label, recipients, message, and redirect path settings.\" class=\"wp-image-9264 lazyload\" style=\"--smush-placeholder-width: 1024px; --smush-placeholder-aspect-ratio: 1024\/588;width:464px;height:266px\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact17-1024x588.png 1024w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact17-300x172.png 300w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact17.png 1261w\" data-sizes=\"(max-width: 1024px) 100vw, 1024px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" \/><figcaption class=\"wp-element-caption\">Drupal comes with a built-in contact form option<\/figcaption><\/figure>\n<\/div>\n\n\n<p>If you use a different platform, you may or may not be able to add a contact form as easily as you can do it in our Website builder or in WordPress. Drupal, for example, comes with a built-in Contact module that you can use (Dashboard -&gt; Extend -&gt; Contact -&gt; Configure), while Joomla allows you to install an extension through its dashboard (you can see the available extensions here: Joomla! Extensions Directory - Contact forms). Explore the settings of the application you have used to build your site to check for a similar option or for a way to add a contact extension\/module.<\/p>\n\n\n\n<p>For platforms that do not have such a functionality or a custom-made website, you can try to add a form manually. Here is a simple form you can use in a file called test.html, for example.<\/p>\n\n\n\n<p>Add the following to an HTML or a PHP page:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;form action=\"mail.php\" method=\"POST\"&gt; \n&lt;p&gt;Name&lt;\/p&gt; &lt;input type=\"text\" name=\"name\"&gt; \n&lt;p&gt;Email&lt;\/p&gt; &lt;input type=\"text\" name=\"email\"&gt; \n&lt;p&gt;Message&lt;\/p&gt;&lt;textarea name=\"message\" rows=\"6\" cols=\"25\"&gt;&lt;\/textarea&gt;&lt;br \/&gt; \n&lt;input type=\"submit\" value=\"Send\"&gt;&lt;input type=\"reset\" value=\"Reset\"&gt; \n&lt;\/form&gt; <\/code><\/pre>\n\n\n\n<p>As you can see, the above code refers to a file called mail.php, so you should create one and add the following code to it:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;?php $name = $_POST&#91;'name']; \n$email = $_POST&#91;'email']; \n$message = $_POST&#91;'message']; \n$formcontent=\"From: $name \\n Message: $message\"; \n$recipient = \"your-email-here@example.com\"; \n$subject = \"Website Contact Form\"; \n$mailheader = \"From: $email \\r\\n\"; \nmail($recipient, $subject, $formcontent, $mailheader) or die(\"Error!\"); \necho \"Thank You! We will contact you shortly.\"; \n?&gt; <\/code><\/pre>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignright size-large is-resized\"><img decoding=\"async\" width=\"292\" height=\"386\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact16.png\" alt=\"Contact form with fields for name, email, message, and buttons to send or clear the input.\" class=\"wp-image-9261 lazyload\" style=\"--smush-placeholder-width: 292px; --smush-placeholder-aspect-ratio: 292\/386;width:169px;height:224px\" data-srcset=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact16.png 292w, https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contact16-227x300.png 227w\" data-sizes=\"(max-width: 292px) 100vw, 292px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" \/><\/figure>\n<\/div>\n\n\n<p>You can quickly test the form if you upload the two files to your account, open your-domain-name\/test.html and fill the form. You will receive an email to the email address you specify in mail.php.<\/p>\n\n\n\n<p>You will find quite a lot of code examples online and some sites like <a href=\"https:\/\/www.w3schools.com\/howto\/howto_css_contact_form.asp\" data-type=\"URL\" data-id=\"https:\/\/www.w3schools.com\/howto\/howto_css_contact_form.asp\" target=\"_blank\" rel=\"noreferrer noopener\">w3schools.com<\/a> allow you to preview what your code will do and how it will look.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"in-conclusion-78227315-504c-4b8f-a1e8-a5a14bc8b63c\">In conclusion<\/h3>\n\n\n\n<p>The contact page of a website is important as it will allow people to get in touch with you if they have any questions about your products\/services. This is why, you should not neglect it when you build the site. The page should be simple, but informative \u2013 we have listed some things you should have on it, but make sure you do not add clutter. You can your address, phone number, email address and a few frequently asked questions that can help your customers. Personalize the page by adding a photo to show people that they will contact a real person, not an automatic bot.<\/p>\n\n\n\n<div style=\"text-align:center\" class=\"wp-block-genesis-blocks-gb-cta gb-block-cta\"><div class=\"gb-cta-image-wrap\"><img decoding=\"async\" class=\"gb-cta-image has-background-dim-100 has-background-dim lazyload\" data-src=\"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2019\/03\/twitter-cover-4.jpg\" alt=\"ICDSoft - Quality web hosting since 2001\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1500px; --smush-placeholder-aspect-ratio: 1500\/500;\" \/><\/div><div class=\"gb-cta-content\"><h2 class=\"gb-cta-title gb-font-size-26\" style=\"color:#313131\"><br\/><br\/><\/h2><div class=\"gb-cta-text gb-font-size-32\" style=\"color:#313131\"><p><\/p><\/div><\/div><div class=\"gb-cta-button\"><a href=\"https:\/\/www.icdsoft.com\/en\/hosting\/wordpress?mtm_campaign=blogen\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"gb-button gb-button-shape-square gb-button-size-medium\" style=\"color:#ffffff;background-color:#3373dc\">Build Your WordPress Site Now<\/a><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>The user experience on your Contact page will be one of the first impressions the site visitors will get. Find out what you should have on that page to make it look great.<\/p>\n","protected":false},"author":1,"featured_media":9228,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"advgb_blocks_editor_width":"","advgb_blocks_columns_visual_guide":"","footnotes":""},"categories":[1,51,11],"tags":[],"class_list":{"0":"post-9226","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-general","8":"category-websites","9":"category-wordpress"},"author_meta":{"display_name":"ICDSoft","author_link":"https:\/\/www.icdsoft.com\/blog\/author\/icdsoft\/"},"featured_img":"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contacttitle-300x200.jpg","featured_image_src":"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contacttitle.jpg","featured_image_src_square":"https:\/\/www.icdsoft.com\/blog\/wp-content\/uploads\/2021\/06\/contacttitle.jpg","author_info":{"display_name":"ICDSoft","author_link":"https:\/\/www.icdsoft.com\/blog\/author\/icdsoft\/"},"coauthors":[],"tax_additional":{"categories":{"linked":["<a href=\"https:\/\/www.icdsoft.com\/blog\/category\/general\/\" class=\"advgb-post-tax-term\">General<\/a>","<a href=\"https:\/\/www.icdsoft.com\/blog\/category\/websites\/\" class=\"advgb-post-tax-term\">Websites<\/a>","<a href=\"https:\/\/www.icdsoft.com\/blog\/category\/wordpress\/\" class=\"advgb-post-tax-term\">WordPress<\/a>"],"unlinked":["<span class=\"advgb-post-tax-term\">General<\/span>","<span class=\"advgb-post-tax-term\">Websites<\/span>","<span class=\"advgb-post-tax-term\">WordPress<\/span>"]}},"comment_count":"0","relative_dates":{"created":"Posted 5 years ago","modified":"Updated 1 year ago"},"absolute_dates":{"created":"Posted on June 28, 2021","modified":"Updated on August 19, 2025"},"absolute_dates_time":{"created":"Posted on June 28, 2021 5:42 am","modified":"Updated on August 19, 2025 9:56 am"},"featured_img_caption":"","series_order":"","_links":{"self":[{"href":"https:\/\/www.icdsoft.com\/blog\/wp-json\/wp\/v2\/posts\/9226","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.icdsoft.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.icdsoft.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.icdsoft.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.icdsoft.com\/blog\/wp-json\/wp\/v2\/comments?post=9226"}],"version-history":[{"count":19,"href":"https:\/\/www.icdsoft.com\/blog\/wp-json\/wp\/v2\/posts\/9226\/revisions"}],"predecessor-version":[{"id":14191,"href":"https:\/\/www.icdsoft.com\/blog\/wp-json\/wp\/v2\/posts\/9226\/revisions\/14191"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.icdsoft.com\/blog\/wp-json\/wp\/v2\/media\/9228"}],"wp:attachment":[{"href":"https:\/\/www.icdsoft.com\/blog\/wp-json\/wp\/v2\/media?parent=9226"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.icdsoft.com\/blog\/wp-json\/wp\/v2\/categories?post=9226"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.icdsoft.com\/blog\/wp-json\/wp\/v2\/tags?post=9226"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}