The Contact Page and Location Page in 5 Star Hotel use Divi Map modules. To continue using these modules, you must acquire a Google Maps API Key (now a paid service). Otherwise a message from Google will appear on your map stating "This page can't load Google Maps correctly", and  your map will be grayed out with a watermark stating "For development purposes only".


If you purchase a Google Maps API Key, you can enter it into Divi Theme Options. The key will appear in any map module used throughout the site auto-magically. To do this:


Navigate to: Admin Menu > Divi > Theme Options > General > enter Google Maps API key into "Google API Key" field > click the "Save Changes" button.


Next, you'll need to change the address used on the Contact and Location pages to your establishment. To do this:


Navigate to: Admin Menu > Pages > All Pages > click "Edit" for each affected page > ensure you're editing with the Divi Builder > find the Map module (already in the layout) > update the address to your establishment > Save & Exit" Module > Update/Save Page > view the Page to ensure the map address has been updated.


There are WordPress plugins available that utilize competing map services to Google Maps (some of which are open-source and free). These can be used instead of Divi's native Google Maps module.


For tips on creating a Google Maps API Key, this video might help:



In the next article, we're going to cover updating HBook settings, so accommodations in the demo content and beyond are connected throughout the website.


Previous Article / Next Article