Skip Navigation

[Resolved] Different map marker for each of the terms within a taxonomy on map view

This thread is resolved. Here is a description of the problem and solution.

Problem: I have a map with markers coming from a View. Each post displayed in the View will have one term assigned from a custom taxonomy. Depending on the assigned term, I would like to display a different marker icon on the map.

Solution: To use custom icons like this based on a taxonomy term, you cannot create the Markers using the configurations available in the Map block. Those Map block side configurations only allow for one icon to be used for all markers. Instead, you'll need to remove all Marker configurations from the Map block and insert a series of conditionals and Marker shortcodes in the View loop block. In a simple scenario there would be one conditional section for each different Marker icon. Here is a simple conditional section you can use as a template:

<!-- day-service icon -->
[wpv-conditional if="(has_term('day-service', 'service-type', null) eq '1')"]
[wpv-map-marker map_id="map-18" marker_icon="day-service-icon.svg" marker_id='marker-18-[wpv-post-id]' marker_field="wpcf-address"]
[wpv-post-link]
[/wpv-map-marker]
[/wpv-conditional]

<!-- other-service icon -->
[wpv-conditional if="(has_term('other-service', 'service-type', null) eq '1')"]
[wpv-map-marker map_id="map-18" marker_icon="other-service-icon.svg" marker_id='marker-18-[wpv-post-id]' marker_field="wpcf-address"]
[wpv-post-link]
[/wpv-map-marker]
[/wpv-conditional]

<!--additional conditional section for each icons should follow here -->

Since this code uses the WordPress function has_term in a conditional clause, you must register has_term in Toolset > Settings > Front-end Content, in Functions inside conditional evaluations.

Relevant Documentation:
https://toolset.com/documentation/programmer-reference/maps/maps-shortcodes/

This support ticket is created 3 years, 2 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

No supporters are available to work today on Toolset forum. Feel free to create tickets and we will handle it as soon as we are online. Thank you for your understanding.

Sun Mon Tue Wed Thu Fri Sat
8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 - -
13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 - -

Supporter timezone: America/New_York (GMT-04:00)

This topic contains 8 replies, has 2 voices.

Last updated by kevinS-30 3 years, 2 months ago.

Assisted by: Christian Cox.

Author
Posts
#2156425

Tell us what you are trying to do?

Hello - i am trying to dynamically assign a specific map marker to each of the 4 terms within a specific taxonomy.

I am A beginner - but have managed to get a fair way down the road with this

in this link hidden link I would like each of the Service types within the taxnomy
service types to display a different icon on the map

Adults - icon 1
Children and young people - icon 2
Day service - icon 3
School - icon 4

I followed the post https://toolset.com/forums/topic/different-map-markers-based-on-custom-taxonomy/

I added -

1) Dashboard-> Toolset-> Settings-> Front-end Content
In section "Functions inside conditional evaluations", add WordPress function: has_term

2) following the instructions

[wpv-conditional if="(has_term('my-taxonomy', 'my-term', null) eq '1')"]
[wpv-map-marker map_id="map-1" marker_icon="<u>hidden link</u>" marker_id='marker-[wpv-post-id]' marker_field="wpcf-address-field-slug" marker_title=" "]
[wpv-post-link]
[/wpv-map-marker]
[/wpv-conditional]

Please replace "my-taxonomy" with your custom taxonomy slug
replace "my-term" with the specific term slug
replace "map-1" with the map ID
replace "hidden link" with the specific specific marker icon URL
replace "address-field-slug" with your custom address field slug

I adapted the shortcode to :-

[wpv-conditional if="(has_term('service-type', 'adults', null) eq '1')"]
[wpv-map-marker map_id="map-15" marker_icon="<u>hidden link;" marker_id='marker-[wpv-post-id]' marker_field="address" marker_title=" "]
[wpv-post-link]
[/wpv-map-marker]
[/wpv-conditional]

But no matter where i place the code or adapt the markers etc - I cannot get the icon to display properly

Perhaps you can see if I am on the right track with the short code .. ( and correct any errors ! ) -
But also PLEASE EXPLAIN STEP BY STEP - where to put the code - and how I adapt the code to show 4 different icons for the 4 different terms within the Taxonomy. 🙂

Is there any documentation that you are following?
https://toolset.com/forums/topic/different-map-markers-based-on-custom-taxonomy/

What is the link to your site?
this is a development site - this is the specific page I am working on
hidden link

Thank you in advance ...

Kevin

#2156435

Hello, can you tell me if you created this Map using a Map block in the block editor? If so, did you add a marker in the map block configurations? If so, that could be part of the problem here, because you should not add both a marker in the map block and a map marker shortcode as shown above. If you have added any markers in the map block configurations, delete them. There is no way to customize the icons using the map block configurations to set up the markers.

Then, the map marker shortcodes and conditional codes you described should be placed inside the loop of a View. If the View is created using the Block editor, you could paste the code in a custom HTML block added into the View's loop block. To customize the code for multiple terms, here's an example, assuming one of the term slugs is "school":

<!-- adults term icon -->
[wpv-conditional if="(has_term('service-type', 'adults', null) eq '1')"]
[wpv-map-marker map_id="map-15" marker_icon="<em><u>hidden link</u></em>" marker_id='marker-[wpv-post-id]' marker_field="address" marker_title=" "]
[wpv-post-link]
[/wpv-map-marker]
[/wpv-conditional]

<!-- school term icon -->
[wpv-conditional if="(has_term('service-type', 'school', null) eq '1')"]
[wpv-map-marker map_id="map-15" marker_icon="<em><u>hidden link</u></em>" marker_id='marker-[wpv-post-id]' marker_field="address" marker_title=" "]
[wpv-post-link]
[/wpv-map-marker]
[/wpv-conditional]

You would need to create a wpv-conditional block for each possible term / icon combination, with different icon URLs for each icon. If your posts can have multiple terms assigned, you can see it gets quite complicated. Ideally each post would only have one term applied, to simplify all the conditional logic. All the conditional codes can be added to the same custom HTML block, that should be okay. Once added to the View's loop, the markers should appear on the map as expected with custom icons.

#2157319
set up 2.jpeg
set up.jpeg

Hi Christian

Thank you so much for trying to help me - I'm so sorry but I just can't get it to work - ( its me, not you 🙂 )

In order to not mess up what I already have - I built a quichk and dirty new page - using the block editor ( i'm using divi theme so not using the divi builder ) - its not a great page but it should work for proof of concept ..

It uses the same data sets ( custom fields and posts ) as the main page

he Ajax filter returns correct results in the view loop . but nothing on the map

hidden link

I've added a loop, a search and a toolset map block ( no markers ) ( map-18)

I placed the following code into the view loop ( see images )

[wpv-conditional if="(has_term('service-type', 'adults', null) eq '1')"]

[wpv-map-marker map_id="map-18" marker_icon="hidden link" marker_id='marker-[wpv-post-id]' marker_field="address" marker_title=" "]

[wpv-post-link]

[/wpv-map-marker]

[/wpv-conditional]

I've show a pic of the page structure - where the code is etc (set up.jpg )

I'm really sorry - I'm very new to this and I'm sure I'm missing something incredibly basic

Any help would be hugely appreciated

**I do get what you are saying about the conditional logic being complicated - but each of the centres MUST be one of the 4 service types so it should display all of them - but each service type should be a different colour ( in this cased defined by different coloured SVG files.

#2157689

Okay let's step back and confirm everything is setup and working correctly as far as we can tell.
- Please go to Toolset > Settings > Maps and click "Check API". After a moment, you should see a message that everything is okay. If you do not see this message, you may need to activate additional API services in the Google console per the message you see there.
- In the same Maps settings page, please click the link that loads cached addresses. You should see one entry for each address that has been saved as a custom address field value. If you do not see the cache of addresses, that could indicate a MySQL upgrade is necessary (minimum MySQL version required for distance filtering is 5.6). I can determine this from your debug info. Please add your site debug information with your next reply, as explained in our FAQ: https://toolset.com/faq/provide-debug-information-faster-support/
- Turn on "debug" mode for this conditional shortcode by adding debug="true", like so:

[wpv-conditional if="(has_term('service-type', 'adults', null) eq '1')" debug="true"]

- Reload the View results, and you should see some debug information added to the View results, explaining why the conditional did or did not work as expected. Scroll to one of the results that has the "adults" term assigned, and copy + paste the conditional debug information for me to review in your next reply.

#2158931

Okay I see what's going on here. I've made some adjustments in the backup site and I wanted to show you an updated template for the conditional code:

[wpv-conditional if="(has_term('day-service', 'service-type', null) eq '1')"]
[wpv-map-marker map_id="map-18" marker_icon="<em><u>hidden link</u></em>" marker_id='marker-18-[wpv-post-id]' marker_field="wpcf-address"]
[wpv-post-link]
[/wpv-map-marker]
[/wpv-conditional]

One of the problems was that has_term was implemented with the arguments backwards, and I didn't realize that. The has_term function expects the term slug first (day-service, adults, etc), followed by the taxonomy slug (service-type). In the examples you were sharing earlier the order was reversed, so the conditionals didn't work as expected. I've switched that in the conditional code. Also, the map marker shortcode attribute "marker_field" requires the wpcf- field slug prefix, so I've added that prefix for you here. I took the liberty of copying and pasting this template for you, so you should be able to jump into the HTML block and update the icon URL for each of the 3 additional marker styles. Here's a direct link to the editor page:
hidden link

Let me know if you have questions about that.

#2158967

Hi Christian - this is incredible support - thank you so much

It is approaching midnight here in the UK so I may no have time to fully explore what you have done - but it looks pretty much perfect ...

I won't close the support ticket yet until I have had chance to fully explore - but I did want to take the opportunity to thank you tonight - for all your hard work and patience ...

Thank you again

#2159005

I just wanted to say - you absolutely nailed it 🙂

I built a new page using the formatting of my original page ( with all the search criteria ) and the full loop content

Copied the code and adjusted it for a new map and it worked - !! (for reference )

hidden link

I would NEVER have got there without your help ... So thank you again

If I need support in the future I know who to ask and I'm looking forward to leaving fantastic feedback --

If i may just leave the ticket open in case I have any further questions

BTW - the map doesn't preview in the back end builder - but is fine in Front end ... not an issue for me - but may be a bug ?

Again Thanks Christian. Amazing

#2161185

Yes the preview does not work well with shortcode-based markers, that's a limitation of the block editor / shortcode implementation. I'll stand by for your updates here.

#2167397

Brilliant support - you help push me up the steepest part of the leaning curve - thank you for patience diligence and prompt responses.

My issue is resolved now. Thank you!