**This procedure allows you to display all the key contact information for our clients, including their local offices or business units.** It involves three steps: ## Step 1: create a "Contact" page ![Create a Contact page GIF](/sites/g/files/dvc2391/files/styles/media/public/image/2024/12/Screen%20recording%202024-12-17%2017.02.08.gif?itok=A1MeRrdi) - **Access the Contact Page Creation Interface**: - Click on **"Content"** in the admin menu. Select **"Add Content"** and choose **"Contact"**. - **Customize the Hero Banner:** - Add a Title. - Add an image or video at the top of the page. Include text and a CTA button if needed. - **Fill Out the Contact Form Section**: - Complete the essential fields: - **First name, Last name, Job title, Type.** - **Enter Contact Details**: - Select the contact method provider (e.g., phone, fax, email). - Input the relevant number or address. - Optionally, add additional items (e.g., secondary phone number or department). - **Add Extra Components (Optional)**: - Add blocks of information like an address, a map, or an embedded contact form to improve functionality. - **Save Your Changes and change the status to "Published".** **Examples:** [ ![](/sites/g/files/dvc2391/files/styles/media/public/image/2024/04/image%2015.png.webp?itok=aIWHSqBD) ](/yujing-wang)[Yujing Contact](/yujing-wang) ### [Yujing Contact](/yujing-wang) [ ![](/sites/g/files/dvc2391/files/styles/media/public/image/2024/04/Alan%201.png.webp?itok=d6tdnaIS) ](https://www.sf.userguide.veolia.com/alan-riou)[Alan Contact](https://www.sf.userguide.veolia.com/alan-riou) ### [Alan Contact](https://www.sf.userguide.veolia.com/alan-riou) [ ![](/sites/g/files/dvc2391/files/styles/media/public/image/2024/04/image%2016.png.webp?itok=mkQqJp6s) ](https://www.sf.userguide.veolia.com/laetitia-coupe)[Laetitia Contact](https://www.sf.userguide.veolia.com/laetitia-coupe) ### [Laetitia Contact](https://www.sf.userguide.veolia.com/laetitia-coupe) [ ![](/sites/g/files/dvc2391/files/styles/media/public/image/2024/04/image%2017.png.webp?itok=Fg2VYh9X) ](https://www.sf.userguide.veolia.com/coralie-gakpe)[Coralie Contact](https://www.sf.userguide.veolia.com/coralie-gakpe) ### [Coralie Contact](https://www.sf.userguide.veolia.com/coralie-gakpe) ![](/sites/g/files/dvc2391/files/styles/crop_freeform/public/image/2024/08/HP%20BG%20-%20grey%20very%20pale.png.webp?itok=OY0Zt4pI) ## Step 2: Add "Contact" to a "Location" Page - **Navigate to the Location Page**: - Go to the **"Content"** section in the admin menu. - Search for and select the **Location** page where you want to add the contact. - **Scroll to the Contact Section**: - Once you're on the location page, scroll down to find the **Contact** section. - **Use the Search Bar to Find the Contact**: - In the contact section, use the **search bar** to find the specific contact associated with that location. - **Select the Contact**: - Click on the desired contact from the search results to select it. - Once the correct contact is selected, click **"Save"** to update the location page with the contact information. ![Contact to Location GIF](/sites/g/files/dvc2391/files/styles/media/public/image/2024/12/Screen%20recording%202024-12-16%2017.30.11%20%281%29.gif?itok=LgZKJrdW) ## Step 3: Create a Hub Page for Contacts - **Create a Page Using the "Page" Content Type** - **Add a New Listing Component** - **Select the "Contact Listing"** - **Choose a Display Option**: - **"MAP"** to display contacts with a location map, showing where each contact is based. - **"GRID"** to display contacts in a grid layout, organizing them into rows and columns. - **Expand the Options Menu to Customize Additional Settings** - Add the **"Title"** field, add a title above the listed contacts if desired. **Save the Changes and change the status to "Published".** ![Hub page for contacts image ](/sites/g/files/dvc2391/files/styles/media/public/image/2024/12/Screenshot%202024-12-16%2017.55.57.png.webp?itok=WhZM9IBt) ### Examples: [HUB page for Contacts (Example)](/hub-page-contacts-example) ### Map display ![GIF hub page for contact - map format](/sites/g/files/dvc2391/files/styles/default/public/image/2024/12/Screen%20recording%202024-12-16%2017.42.35.gif?itok=-xAmHpb4) ### Grid display ![Hub page for contacts image ](/sites/g/files/dvc2391/files/styles/default/public/image/2024/12/Screenshot%202024-12-16%2017.42.10.png.webp?itok=m-2txUz-) ![](/sites/g/files/dvc2391/files/styles/crop_freeform/public/image/2024/08/HP%20BG%20-%20grey%20very%20pale.png.webp?itok=OY0Zt4pI) ## Discover Content types to Enrich Your Website Pages [All content types here](/drupal-essentials/content-types) [ ![planet article logo](/sites/g/files/dvc2391/files/styles/media/public/image/2025/02/Design%20sans%20titre%20%288%29.png.webp?itok=qZGLqlX-) ](/create-planet-article-pages-and-hub-page)[Planet article](/create-planet-article-pages-and-hub-page) ### [Planet article](/create-planet-article-pages-and-hub-page) [ ![Contact logo](/sites/g/files/dvc2391/files/styles/media/public/image/2025/02/Design%20sans%20titre%20%2821%29.png.webp?itok=Sdni04-2) ](/create-contact-pages-and-hub-page)[Contact](/create-contact-pages-and-hub-page) ### [Contact](/create-contact-pages-and-hub-page) [ ![event logo](/sites/g/files/dvc2391/files/styles/media/public/image/2025/02/Design%20sans%20titre%20%2820%29.png.webp?itok=SzInMCb-) ](/create-event-pages-and-hub-page)[Event](/create-event-pages-and-hub-page) ### [Event](/create-event-pages-and-hub-page) [ ![Location logo](/sites/g/files/dvc2391/files/styles/media/public/image/2025/02/Design%20sans%20titre%20%2817%29.png.webp?itok=GEoAWZ5H) ](/create-location-pages-and-hub-page)[Location](/create-location-pages-and-hub-page) ### [Location](/create-location-pages-and-hub-page) [ ![Market logo](/sites/g/files/dvc2391/files/styles/media/public/image/2025/02/Design%20sans%20titre%20%2812%29.png.webp?itok=5cVANvMP) ](/create-market-pages-and-hub-page)[Market](/create-market-pages-and-hub-page) ### [Market](/create-market-pages-and-hub-page) [ ![Solution logo](/sites/g/files/dvc2391/files/styles/media/public/image/2025/02/Design%20sans%20titre%20%2813%29.png.webp?itok=u12oKkgl) ](/create-solution-pages-and-hub-page)[Solution](/create-solution-pages-and-hub-page) ### [Solution](/create-solution-pages-and-hub-page) [ ![News logo](/sites/g/files/dvc2391/files/styles/media/public/image/2025/02/Design%20sans%20titre%20%2814%29.png.webp?itok=QRGiiqH5) ](/create-news-pages-and-hub-page)[News](/create-news-pages-and-hub-page) ### [News](/create-news-pages-and-hub-page) [ ![Press Release logo](/sites/g/files/dvc2391/files/styles/media/public/image/2025/02/Design%20sans%20titre%20%2815%29.png.webp?itok=htOVILHu) ](/create-press-release-pages-and-hub-page)[Press Release](/create-press-release-pages-and-hub-page) ### [Press Release](/create-press-release-pages-and-hub-page) [ ![Resourcer Story logo](/sites/g/files/dvc2391/files/styles/media/public/image/2025/02/Design%20sans%20titre%20%2816%29.png.webp?itok=mfBd-Y4g) ](/create-resourcer-story-pages-and-hub-page)[Resourcer Story](/create-resourcer-story-pages-and-hub-page) ### [Resourcer Story](/create-resourcer-story-pages-and-hub-page) Previous Next ## Ask for support We use ServiceNow to track all of your requests and questions [Create a ticket now](https://veglobal.service-now.com/s3c?id=service_catalog&root=fcec05201b1649504d79dce2b24bcb50) ![](/sites/g/files/dvc2391/files/styles/crop_freeform/public/image/2024/04/image%2014%20%283%29.png.webp?itok=j1xAfftb)