How to Create a Contact Page Layout Like This Site

When we designed the Contact Info, we considered that different users might have their own ideas about the contact page layout, so we only kept the basic horizontal and vertical contact icon layouts and did not fully design a ready-to-use contact template.

If you want to create a contact page with a design like the screenshot below, please follow our steps.

Snipaste 2025 12 17 19 56

Steps:

1. Create a new page in the Admin Dashboard, name it Contact or any other name you prefer.

2. Create a column, select a left-right layout (click the + icon at the top left of the page or the + icon on the page).

Wp blog

3. After creation, click the + icon in the left column to add a Heading block, enter the title „Contact Us“, then press Enter.

4. After pressing Enter following the title, it defaults to a Paragraph block, where you can directly input the description text. Press Enter again after finishing.

5. After the description content, press Enter, click the + icon to add a Contact Info block, click Add Entry to add contact information. You can choose between horizontal or vertical layout.

Wp blog

6. Then click the column on the right, click the + icon, and add a Shortcode block.

Image

7. In the shortcode field, enter the shortcode of your inquiry form plugin (if not installed, go to Plugins in the Admin Dashboard, search for a form plugin, install it, then copy and paste its shortcode here).

If you also want the contact icons on the left to remain fixed at the top when scrolling, you need to manually create custom CSS code. Beginners might not know how to add this; you can directly contact customer service for assistance.