Allow users to filter by category?

[vermal]

Hello!

I checked this box, but nothing changes in the front-end of the map.
Is there a possibility to see in the list just the categories, and when clicking on one category to envelop the locations from that category?(like a tree?)
Or how is this feature working?

Thanks in advance (for the best support team I have ever got in touch with)!

[vermal]

Hello,
I got it, eventually (there were two places where I should’ve ticked the ‘allow users to filter by category’, but now I want to see the the options not as a drop down list (as it is in this moment), but as an opened list (like in your markers category demo, on your site).
How to do that?

Thanks!

[vermal]

And also, can it be done this: the filter by category to be above the map and the store locator to be under the map (in my case the two features are not the same thing).

Waiting for your response.

Thanks.

[vermal]

And also another question:
– how to make the width of the marker’s carousel (in listing) like in your demo https://www.wpgmaps.com/demo/map-with-marker-listing-carousel/
For the moment it takes the maximum width of the text or image (depends which is the biggest).

( http://lilletromania.ro/locatiile-lillet-romania/ )

Thanks!

[Perry]

Hi Vermal,

To display the categories as checkboxes please go to Maps -> Settings and under “Filter by category displayed as” select the checkboxes option.

With regards to the carousel, can you please go to Maps -> Settings -> Advanced and go to the Custom CSS field. Please add the following CSS:

.wpgmza_marker_carousel
{
 width: 50% !important;
 margin: auto;
}

You can tweak that width percentage to taste

Is there anything else I can help you with?

Kind regards

[vermal]

Wonderful!
Worked like a charm.

One more thing:
-how can I make the title of the markers (in the carousel) a different size or style? (I want to make it not bold, or to resize it to a smaller size – because in mobile the carousel is jumping one over the other).

Thanks.

[vermal]

An also, is there a way to move the categories (just them, not all the searching for the search locator) below the map?

[Perry]

Hi Vermal,

This custom JS will move the category checkboxes underneath the map:

$(".wpgmza_map").after($(".wpgmza_sl_category_div")[0])

However I wouldn’t recommend you do that as the search button is now above it which might be misleading to your users.

The following CSS will make the text normal weight and smaller:

.wpgmza_marker_carousel .item .wpgmza_marker_title
{
 font-weight: normal !important;
 font-size: 0.8em !important;
}

You can tweak the weight and size to taste

Is there anything else I can help you with?

Kind regards

[vermal]

You are right, I won’t change the category.
Worked with the text, thanks.

And one more thing!
I want to ask for a quotation for a customization (may I ask it through you?):
when i click on a cluster on the map to list just a certain category?

Thanks again for all the help.

[vermal]

oh!
I remembered!
What is that thing in the right of the user’s input location (it looks like a target and when i click on it then the input auto-fills with some point – from florida).
How can I edit that? (or just make it disappear).

Thanks again for all your efforts.

[Perry]

Hi Vermal,

You can hide that button using the following CSS:

button#sl_use_my_location_1
{
display: none;
}

If for some reason that doesn’t work, change the middle line to

display: none !important;

And thank you, no bother, it’s what I do and I very much enjoy the job!

Thank you
– Perry

[ppd]

Hi, apologies for jumping on old thread.. but I’m hoping to move category checkboxes under map. Could you help confirm where the custom javascript noted above should be added?
I tried adding this to theme using document.ready, but am not seeing any change?

$(“.wpgmza_map”).after($(“.wpgmza_sl_category_div”)[0])

Thanks!

[Perry]

Hi Roy,

Thank you for getting in touch,

You should be able to add that code in using a custom JS plugin (there are plenty of good free ones) like so:

jQuery(document).ready(function() {
jQuery(“.wpgmza_map”).after(jQuery(“.wpgmza_sl_category_div”)[0])
});

If that doesn’t work for you, could you please open your developer tools (F12 on most browsers), reload the page and tell me if you get any Javascript errors?

Kind regards
– Perry

[sasmueller]

This reply has been marked as private.

[mugwumpus]

I’d like to set up the carousel and allow people to select one of four symbols to either look for or add to the map I’m setting up. I, so far, can’t see how I can provide this option to my visitors.

I”m interested in this custom CSS code

“With regards to the carousel, can you please go to Maps -> Settings -> Advanced and go to the Custom CSS field. Please add the following CSS:”

I don’t see where I’m supposed to put this. Do I need to have an “advanced custom fields” plugin first?

[Author]

Posts