[Resolved] Populate map marker icon from custom post field

[Author]

Posts

[michaelB-49]

Tell us what you are trying to do?
I'm trying to populate the map marker icon from an image field that I store in each custom post field group.

Is there any documentation that you are following?
Not really, couldn't find any for what I'm trying to do, although I might be missing it as this seems like it should be a common request.

Was looking at this initially but couldn't translate it to the current version of Toolset:
https://toolset.com/forums/topic/custom-markers-per-address-with-maps/

Is there a similar example that we can see?
No.

What is the link to your site?
Here's the page where I'm trying to get the markers to pull from the correct field:
hidden link

The field I want to use for each map marker is Marker Icon (marker_icon) in the Post Field Group for Locations.

I know this probably sounds super simple, but I am having a rough time trying to figure it out! Thanks for your help.

[Christopher Amirian]

Hi there,

That is not possible with the Toolset blocks. It is possible to add custom markers manually following the steps below:

Go to the Toolset → Settings page and click the Maps tab. There, look for the Map markers section and click the Add a new marker button.

But if you want to have a dynamic custom map marker you will need to enable the Legacy mode in Toolset:

https://toolset.com/course-lesson/enabling-legacy-version-of-toolset-views/

And add a classic view where you can use shortcodes to add the map and thee you can use the shortcodes to assign the custom field shortcode inside the attribute of th emap shortcode.

For more information:

https://toolset.com/forums/topic/custom-image-as-map-icon-marker/#post-2008503

Thanks.

[michaelB-49]

Hi Christopher,

Thanks, sounds like we're on the right track. Your response made me re-think how we should be coding this, and I have code already working (from another Toolset support agent a while ago) on a test site you can see at the link below (it's not pretty, was just designed to test different map markers per location type):

hidden link

On that site, we have a shortcode in the View Loop like you suggested, although we did NOT change the interface settings like you mentioned -- they are set to this: "Show only the Blocks interface".

Here's the shortcode we use on that site to make the page work:

[wpv-conditional if="( '[wpv-post-type]' eq 'restaurant')"]
[wpv-map-marker map_id='Dallas-Fort-Worth-Map' marker_id='marker-[wpv-post-id]' marker_icon='//adventureswithmydog.com/wp-content/uploads/2022/03/Restaurant-Map-Icon.png' marker_field='wpcf-location-address'][wpv-post-link][/wpv-map-marker]
[/wpv-conditional]

[wpv-conditional if="( '[wpv-post-type]' eq 'park')"]
[wpv-map-marker map_id='Dallas-Fort-Worth-Map' marker_id='marker-[wpv-post-id]' marker_field='wpcf-location-address' marker_icon='//adventureswithmydog.com/wp-content/uploads/2022/04/Park-Map-Icon.png'][wpv-post-link][/wpv-map-marker]
[/wpv-conditional]

What I now need to do on the new site is instead of checking the WPV-POST-TYPE, I just want to set the marker_icon value = the WPCF-MARKER-ICON field. Here's the new test page I'm using for this:
hidden link

Unfortunately I can't get any of the code I'm putting in that shortcode section to work right now, seems like it's basically ignoring it (or I've messed up some syntax maybe?).

Here's the code I'm using, which does set the map properly (all the points are there), but the map markers are invisible:

[wpv-map-marker map_id='Dallas-Fort-Worth-Map' marker_id='marker-[wpv-post-id]' marker_field='wpcf-address' marker_icon=[wpcf-marker-icon output='url']][/wpv-map-marker]

Can I send over login creds again so you can see the page in action and see if I'm dealing with some kind of bug, just me messing up the code, etc?

Thanks Christopher.

[Christopher Amirian]

Hi there,

I will do my best to check but please consider that there is no guarantee. I will spend time on that,

I'd appreciate it if you could give me the URL/User/Pass of your WordPress dashboard. Only the test site please not the live site

Make sure you set the next reply as private.

One last thing is that the map icon attribute shortcode is not wrapped in " so I suggest that you test this:

[wpv-map-marker map_id='Dallas-Fort-Worth-Map' marker_id='marker-[wpv-post-id]' marker_field='wpcf-address' marker_icon='[wpcf-marker-icon output="url"]'][/wpv-map-marker]

Thank you.

[Christopher Amirian]

Hi there,

Here is the correct code:

[wpv-map-marker map_id='Dallas-Fort-Worth-Map-Test' marker_id='marker-[wpv-post-id]' marker_field='wpcf-address' marker_icon='[types field="marker-icon" size="thumbnail" url="true"]'][/wpv-map-marker]

To retrieve the image field with URL you need to use the types shortcode according to this documentation:

https://toolset.com/documentation/customizing-sites-using-php/functions/#image (Check the shortcode section with URL)

Now if you search the city "Mansfield" I added a green icon for one of the locations there and you can see in the map that it reflects the correct image. (Check the attached screenshot)

Thank you.

[michaelB-49]

Thank you Christopher, that's outstanding!

The only issue it creates is that we have code in the HINT CONTENT and the POP-UP CONTENT, which you can see on this page:
hidden link

Now I don't know how to populate that content once we move the marker code into the shortcode instead of on the map itself, if that makes sense.

[Christopher Amirian]

Hi there,

For this, you need to create a content template and name it 'Marker-Info-Popup'. Add your pop up content to that content template.
Then you can use that name and add the pop up content inside the map marker shortcode like this:

[wpv-map-marker map_id='Dallas-Fort-Worth-Map-Test' marker_id='marker-[wpv-post-id]' marker_field='wpcf-address' marker_icon='[types field="marker-icon" size="thumbnail" url="true"]'][wpv-post-body view_template="Marker-Info-Popup"][/wpv-map-marker]

For more information:
https://toolset.com/forums/topic/customizing-the-pop-up-on-a-map/#post-1581189

Thanks.

[michaelB-49]

My issue is resolved now. Thank you!