Open Divi Map Module Pin Details by Default

Show your Map Module pin details on load without editing core files

A common request I get is for a way to have the Divi Map Module pin details shown by default, without requiring the user to click the marker. Due to the way Divi generates its Google Maps, there is no way to directly access the markers added by the Map Module. This makes it difficult to make a marker show by default.

A tutorial by Phire Base describes how to do it by directly editing the Divi core files. This is not an ideal way to do it, though, as the changes will be lost whenever you update Divi. For a while I thought this was the only way it could be done.

However, I've now come up with a better way, which doesn't require editing Divi's files and will survive theme updates.

Open the Map Pin Details by Default using jQuery

While there is no way to access the pin markers, it turns out it that it is possible to access the map object. This doesn't give access to the pin markers, but it does enable a trick that achieves the required effect of having the pin details open by default.

By copying the code Divi uses to add the pins, we can add another set of identical pins over the top of the ones Divi has added. They will look the same and be in the same place, but have the benefit that we can edit their properties. In this way we can configure them to show the pin details by default. Then if the details are closed we can delete our pins, leaving the originals to behave as they normally do.

The following jQuery will cause all pins to start open by default:

Open the Map Pin Details by Default using Divi Booster

I've added an option in Divi Booster (v2.6.9 upwards) to allow you to control which map pins are shown, without the need to add any code. Additionally, the Divi Booster feature allows you to control the behavior of individual pins. This means, for example, that you can choose to show the pin details by default for some pins on the map, but leave the details hidden on other pins on the same map.

You can use the feature by going into the Pin Settings for a pin in the Map Module and setting "Show Details by Default" to "Yes", like so:

Open the Map Pin Details by Default using Map Module Extended

Another option for showing the map pin details by default is the Map Module Extended plugin. This plugin adds a new module to Divi which behaves like the standard map module, but with additional style and functionality options, one of which is the ability to open the pin details on load. By re-implementing the module, this plugin is able to bypass the need for the technique I've described in this post.

The Map Module Extended plugin lets you choose on a module-by-module basis whether to show the pin details, rather than on a pin-by-pin basis as is the case in Divi Booster.

Want get more out of Divi?

Hundreds of new features for Divi
in one easy-to-use plugin

1 Comment

  1. David Steenkamp

    This worked absolutely perfectly, thank you!

    Reply

Submit a Comment

Your email address will not be published. Required fields are marked *