The popup that opens when a visitor clicks a marker on a GeoDirectory map is called the map bubble. You can choose which fields it shows from the field settings, restyle it with CSS, or change its layout with a template override.
Choose which fields appear
- Go to Places > Settings > Custom Fields.
- Open a field and, under “Show in extra output location”, tick Map bubble.
- Save the field and repeat for each field you want in the bubble.
The bubble always shows the listing title, an image, the rating and the favorite button. Fields you tick appear below those.
Restyle it with CSS
The bubble is wrapped in the .gd-bubble class. Right-click inside an open bubble and choose Inspect to find the class of the part you want to change, then add your CSS in Appearance > Customize > Additional CSS. If logos look too big, see How to Fix Logo Size Issues in Map Bubbles?.
Change the layout with a template override
The bubble layout is a template made of GeoDirectory shortcodes, such as [gd_post_title], [gd_post_images] and [gd_output_location location="mapbubble"]. To change the order or add your own content:
- Copy
wp-content/plugins/geodirectory/templates/bootstrap/map/map-popup.php. - Paste it into your child theme as
wp-content/themes/your-child-theme/geodirectory/bootstrap/map/map-popup.php. - Edit the copy. You can move, remove or add GeoDirectory shortcodes.
Use a child theme, so a theme update doesn’t remove your copy. If the site uses the legacy (non-Bootstrap) design style, the file is templates/map-popup.php and the copy goes in your-child-theme/geodirectory/map-popup.php. More in Customizing templates.
Images in search results and listing cards
Images on listing cards in archive and search results come from the Archive item template, not the map bubble. Edit the page set as Archive item page in GeoDirectory > Settings > General > Pages and place a GD > Post Images block where you want the image.