How to Add Shortcode inside Leaflet Marker Shortcode

There is a plugin Nested Shortcodes by Outerbridge. I tested it, it works with my small example.

Or you can write your markers in a geojson file and use it like [leaflet-geojson]Field A = {field_a}[/leaflet-geojson], see Bozdoz documentation.

@hupe13 , this plugin is allowing me to add a simple shortcode to echo some text but nothing more. I created a shortcode to display custom post type with title, content and gallery shortcode and it works well inside the_content but it is stripping all html tags and disables the gallery shortcode when I try to add it inside the [leaflet-marker]

To my dismay, all the html tags get stripped and the [gallery] shortcode that I use inside my CPT is no longer displayed. This is how the popup html looks for me IMAGE: Popup HTML

I have not tested it but I am pretty sure the Geojson file will also not be able to pass html tags, so I am pretty much stuck at the moment. Any help would be much appreciated.

A gallery as a popup, all respect.
Try to excute php. I have defined my own shortcode for that: [php] some php code [/php].

[leaflet-map fitbounds]
[php]
$mygallerie = do_shortcode('[gallery ids="3192,3645"]');
echo do_shortcode('[leaflet-marker address="myadress"]'.$mygallerie.'[/leaflet-marker]');
[/php]

P.S. Please replace " with “. The editor destroys that.

• This reply was modified 1 year, 11 months ago by hupe13.
• This reply was modified 1 year, 11 months ago by hupe13.

@hupe13 ,
I could not make it work like that but I was able to keep the shortcode html (using the Nested Shotcodes by Outerbridge plugin too) by replacing line 375 from class.leaflet-map.php
echo \"{$shape}.bindPopup(window.WPLeafletMapPlugin.unescape({$message}))\";

with echo \"{$shape}.bindPopup({$message})\";

My shortcode structure looks like this in the cms:

[leaflet-map address="Panhandle, San Francisco" zoom=13 height=878]
[leaflet-marker lat=37.79418967176286 lng= -122.40021432209008 iconUrl="/wp-content/uploads/2022/12/Pin.png"][leaflet-popup id=132][/leaflet-marker]

Any reason that this should strip all html tags? If not, perhaps, you can update the plugin, so this can work out of the box? Many thanks.

• This reply was modified 1 year, 11 months ago by Atanas Yonkov.

Your post isn’t here any more, but I got the mail. Please write your question again, @bozdoz will surely know a solution.

@bozdoz , can you have a look please? Line 375 in class.leaflet-map.php causes problems (it strips all html tags inside the popup) when using nested shortcode inside [leaflet-marker]

I don’t think any of our shortcodes call do_shortcode (https://developer.www.ads-software.com/reference/functions/do_shortcode/)
I could try to add it, I suppose, or if you wanted to alter your own files, you could probably add it yourself, somewhere in here, using $content:

https://github.com/bozdoz/wp-plugin-leaflet-map/blob/master/shortcodes/class.marker-shortcode.php#L31

or here, to affect all shortcodes:

https://github.com/bozdoz/wp-plugin-leaflet-map/blob/master/shortcodes/class.shortcode.php#L48

I might just try to add $content = do_shortcode($content);

I might have a hard time justifying adding this to the library, but I could try to test it out myself and see if it’s easy to add (it’s possible that it’s super easy without any drawbacks!)

Specific to stripping HTML tags, that function is calling $message = htmlspecialchars($message);

https://github.com/bozdoz/wp-plugin-leaflet-map/blob/master/class.leaflet-map.php#L366-L389

This is to reduce the risk of XSS. I’m not sure how to get around that. Maybe could add an attribute to disable that (not sure if WordPress would be OK with that). Or, better yet, you could try removing it yourself.

The other thing that’s happening is we’re calling unescape on the content, which just returns innerText of any HTML string:

https://github.com/bozdoz/wp-plugin-leaflet-map/blob/master/class.leaflet-map.php#L366-L389

This was also done for security reasons.

@bozdoz , is there a way to remove this without altering plugin files, which I believe is a bad practice? Perhaps having a hook or something that lets you modify the popup?

yeah, a hook might be a good idea.

Hi @bozdoz , any update on this one? Can you provide a way to override the following function:

add_popup_to_shape

I need to implement a design that looks something like this but currently all html tags get stripped, so it is not possible. A hook would be great. Thank you!

I added an issue: https://github.com/bozdoz/wp-plugin-leaflet-map/issues/185

but, like I said, I have a hard time justifying making this change. If I can find a good way to do it, sure; but just a blanket do_shortcode feels like I’m sure to make people upset.

Actually, the shortcode is not the problem here, maybe I did not explain it correctly in the first place. I have a problem with how add_popup_to_shape functions and I need a way to override it without hardcoding the change in the plugin.

(At the beginning, I was having an issue with shortcode not working inside shortcode but I fixed it by installing the plugin that you recommended.)

The current issue that I have problem with and I would like you to fix are lines 376 and 377 of add_popup_to_shape function, since it is stripping down all html code from the leaflet popup box, while I need to display custom post type content because of design specifications. Image

While I understand the plugin strips all html tags for security reasons, it also leaves us with no way to display html code inside the leaflet message. For example, try to add an image there – it will not work. There needs a way to be able to add custom content in this box but currently it does not seem to be possible.

• This reply was modified 1 year, 9 months ago by Atanas Yonkov.

I’ve added an image without issue:

image in marker popup