# Contact Info
The **Contact Info** **Widget** is used to display detailed information about your company so that your customers can contact you easily.
### Using the **Contact Info** widget
Go to your site and start editing the page with Elementor.
### Step 1:
Select the **Contact Info** widget from the menu bar on the left-hand side of your screen then drag and drop it into the selected area.
### Step 2:
You will get a window with the basic setting options under the **Content** tab. There you can edit the general information and customize the offices' list:
Then you need to edit the offices information by adding the contact details:
{% hint style="warning" %}
To make maps work you need to connect the API for Google Maps on your account, you need JavaScript API, Places API, and Geolocation API. You can follow the [Google Maps Integration manual](https://elementor.com/help/google-maps-integration/) for detailed instructions.
{% endhint %}
Hit on the **Add items** to add/delete items.
### Step 3:
Now, by clicking on the Style Tab you can customize the text color, typography, margin, padding, border, size, and many more for used elements:
In the Map section of the Style tab, you can set a custom Pin icon and change the style of the Map using JavaScript Style Array code which can be created in the [Snazzy Maps service](https://snazzymaps.com/).
{% hint style="success" %}
You can follow the [Google Maps Styles manual](https://docs.stylemixthemes.com/companion-theme-documentation/integrations/google-maps#google-maps-styles) to create custom Map styles.
{% endhint %}
Here you can find the default Map style which is used in our demo:
{% file src="" %}
### Step 4:
If you want to add motion effects, background, or make the page responsive, click on ‘Advanced**’** to explore those options. This **‘Advanced’** tab is a default feature of Elementor. Give a read to [this Document](https://docs.elementor.com/article/571-advanced-tab) to know more about Advanced features and their uses.
Finally, after completing all the customization click on ‘Publish’ to see your work live.
{% hint style="info" %}
You can switch between offices by clicking the drop-down menu.
{% endhint %}
Great job! You have done it successfully.
