Can I add a MAP and Google/ Facebook reviews sections to a Webflow CMS page that pulls the API key from the CMS?

Published on

September 22, 2023

Note

CommunityFAQ is not affiliated with Webflow. Click here if you'd like to visit Webflow's help resources.

Yes, you can add a map and Google/Facebook reviews sections to a Webflow CMS page that pulls the API key from the CMS. Here's how you can do it:

Obtain the API keys:

For Google Maps: Go to the Google Cloud Platform and create a project. Enable the "Maps JavaScript API" and "Places API" for your project, and obtain the API key.
For Google Places API: Enable the "Places API" for your project in the Google Cloud Platform and obtain the API key.
For Facebook Reviews: Obtain a Facebook API access token by creating a Facebook Developer account and setting up an app.

Accessing API keys from the CMS:

Within Webflow, create a new Collection in the CMS to store the API keys.
Add a new field for each API key you want to store, such as "Google Maps API Key," "Google Places API Key," and "Facebook API Access Token."
In the settings of the CMS Collection, add a few entries with the corresponding API keys.

Adding the map section:

Create a new Collection Template page or edit an existing one.
Add a new dynamic field to the page for each API key you want to use.
Drag and drop an Embed element onto your page where you want the map to appear.
In the Embed settings, insert the code to display the map using the API key from the CMS Collection.

Adding the Google/Facebook reviews section:

Follow the same steps as for the map section, but use different dynamic fields to retrieve the API keys.
Customize the embedded code for displaying the reviews, using the API keys from the CMS Collection.

By following these steps, you can add a map and Google/Facebook reviews sections to your Webflow CMS page that pulls the API keys from the CMS. This allows you to easily manage and update the API keys in one place without having to hardcode them into your site's code.

Additional Questions:

How do I create a Google Maps API key for my Webflow site?
Can I customize the design of the map section in Webflow?
Is it possible to display Google and Facebook reviews side by side on a Webflow CMS page?

Is there a clean way to handle three column, two column, and four column tables with easily uploadable data within the CMS using Webflow?

Can elements, like a navigation bar, be easily repeated on multiple pages in Webflow?

Is original content important for a website in Webflow, and where can I find texts for my website?

What could be causing blank spaces to appear on a CMS page despite the presence of both the main image and headline text in each publication?

How can I conditionally show or hide elements on a CMS Template page in Webflow, depending on whether the page was accessed from the search result page or the catalog page?

How can I style and display multiple photos on grids or flexbox within a blog post using Rich Text in Webflow?

What happens to the edits and posts made by a 'Content Editor' in Webflow if their account is removed?

How can I prevent Webflow from cloning and changing my first blog post when creating a second one?

Is it possible to display my work as a slider using the multi-image field in Webflow's CMS for my portfolios?

How can I resolve the issue of not being able to upload my 32 X 32 px Favicon to my Webflow site?