Skip Navigation

[Resolved] Style map distance filter

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

Problem:

I want to style and translate the distance filter, where can i do that?
Where can i set that the autocomplete results are only in germany?
Where can i delete the input fielt of km and mi?

In the view i have the following code:
[wpv-control-distance default_distance="15" compare_field="adresse" distance_center_url_param="toolset_maps_distance_center" distance_radius_url_param="toolset_maps_distance_radius" distance_unit_url_param="toolset_maps_distance_unit"]

Solution:

Q1) style distance filter
You can use CSS codes to style the distance filter field, for example:

input.js-toolset-maps-distance-value{
  /* here add your custom CSS codes*/
}

Q2) translate the distance filter
You can change the placeholder text "Show results within... " and "Use my location" text manually by setup the shortcode attributes "inputs_placeholder" and "visitor_location_button_text", for example:

[wpv-control-distance inputs_placeholder="MY OWN Show results within %%DISTANCE%% of %%CENTER%%" visitor_location_button_text="MY OWN Use my location" ...]

Q3) Where can i set that the autocomplete results are only in germany?
There isn't such a built-in feature within Toolset maps plugin yet.

Q4) Where can i delete the input fielt of km and mi?
There isn't such a built-in feature within Toolset maps plugin, but you can hide it with some CSS codes, for example:

select.js-toolset-maps-distance-unit{
display:none;
}

Q5) Is there a possibility to change the input field distance in ajax slider like that?
There isn't such a built-in feature within Toolset maps yet.

Relevant Documentation:

This support ticket is created 6 years, 8 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.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Hong_Kong (GMT+08:00)

This topic contains 5 replies, has 3 voices.

Last updated by J S 6 years, 8 months ago.

Assisted by: Luo Yang.

Author
Posts
#620570

Hello,

i want to style and translate the distance filter, where can i do that?
Where can i set that the autocomplete results are only in germany?
Where can i delete the input fielt of km and mi?

In the view i have the following code:
[wpv-control-distance default_distance="15" compare_field="adresse" distance_center_url_param="toolset_maps_distance_center" distance_radius_url_param="toolset_maps_distance_radius" distance_unit_url_param="toolset_maps_distance_unit"]

Link to the example: hidden link

Please help!

Nice regards
Markus

#620808

Dear Markus,

Q1) style distance filter
You can use CSS codes to style the distance filter field, for example:

input.js-toolset-maps-distance-value{
  /* here add your custom CSS codes*/
}

Q2) translate the distance filter
You can change the placeholder text "Show results within... " and "Use my location" text manually by setup the shortcode attributes "inputs_placeholder" and "visitor_location_button_text", for example:

[wpv-control-distance inputs_placeholder="MY OWN Show results within %%DISTANCE%% of %%CENTER%%" visitor_location_button_text="MY OWN Use my location" ...]

Q3) Where can i set that the autocomplete results are only in germany?
There isn't such a built-in feature within Toolset maps plugin, if you agree, we can take it as a feature request

Q4) Where can i delete the input fielt of km and mi?
There isn't such a built-in feature within Toolset maps plugin, but you can hide it with some CSS codes, for example:

select.js-toolset-maps-distance-unit{
display:none;
}
#620871
Unbenannt.JPG

Hi Luo,

thank you very much!
Is there a possibility to change the input field distance in ajax slider like that? (see attachement)

Nice regards
Markus

#621182

For the new question:
change the input field distance in ajax slider

There isn't such a built-in feature within Toolset maps, if you agree, we can take it as a feature request.

#621304

Yes please take this points as a feature request.

#921853

J S

This is a helpful post on how to style the Distance Search filter, but can you elaborate a bit more?

Specifically, how can I make the width of the distance input box narrow, or better yet, only as wide as the distance value selected?

How can a slight radius be applied to the corner of the entry boxes for this search only, and not globally throughout the site?

How can an glyphicon be included as a placeholder in the entry boxes?