Support » Plugin: WP Store Locator » Customize code/position of reset and autolocate buttons

Customize code/position of reset and autolocate buttons

  • Resolved Mad Max

    (@mad_max)


    4 years, 2 months ago

    First of all, thanks for this great plugin! I’m making all sort of customizations I need without touching your code: there’s a filter or an option for almost everything and the documentation is pretty good.
    What I’m not able to find is a way to customize the code for #wpsl-map-controls, or at least, a way to insert an autolocation button in the search form. I’d like to disable autolocation feature on page load and make this feature available clicking a button in the search form.
    Is it possible?
    I’m on WP 4.7.2 with WPSL 2.2.7

    Thanks in advance, Daniele.

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author Tijmen Smit

    (@tijmensmit)

    4 years, 2 months ago

    You can customize the existing map controls with this filter.

    If you want to create custom button in the search form, then you first have to create a custom template, and in the template include a button that has the ‘wpsl-icon-direction’ class.

    Thread Starter Mad Max

    (@mad_max)

    4 years, 2 months ago

    Thanks a lot! Using this class on my custom form button, works great. Maybe you should add this tip in the docs.

    Oh, and thanks for you super quick response. Excellent support!

    Plugin Author Tijmen Smit

    (@tijmensmit)

    4 years, 2 months ago

    Yeah, you’re right. I do need to write an article about this for the documentation section, I will do that soon.

    Thread Starter Mad Max

    (@mad_max)

    4 years, 2 months ago

    Still on the subject of customization, I think that ids and classes you use for functional pourpose, like #wpsl-search-btn or the .wpsl-icon-direction above, should not be used to apply styles to these elements.
    For example, when I add the wpsl-icon-direction class on my custom button to make it trigger the geolocation request, it inherits all css rules used for the default geolocation button and I’m forced to override all rules that don’t apply in my specific custom layout.
    It would be great if adding a particular class or id to a user custom element, it would inherit only the required functionality and not even some css rules.

    toca711

    (@toca711)

    4 years, 2 months ago

    Hi Daniele

    Sorry to revive a closed thread but could you share how you made the auto-location button?

    Plugin Author Tijmen Smit

    (@tijmensmit)

    4 years, 2 months ago

    @toca711 there is already build in support for the auto location button.

    If you enable the “Attempt to auto-locate the user” option on the settings page, then it will show up in the right bottom of the map.

    If you want to show it in another location, then this explains how to do so.

    Thread Starter Mad Max

    (@mad_max)

    4 years, 2 months ago

    @toca711: I’ve created a custom template and added class wpsl-icon-direction to an input of type button.
    Then I’ve added some lines of css style to override the style of .wpsl-icon-direction

    <input id="wpsl-custom-locate-btn" class="wpsl-icon-direction" value="NEAR ME" type="button">

    Alternatively, you can add some lines of js to trigger the click on the wpsl original button, when a user click on your custom button. Something like this:

    jQuery(function($) {
	  $('#wpsl-custom-locate-btn').on('click',function(){
	  	$('.wpsl-icon-direction').trigger('click');
	  });
	  
	});
    • This reply was modified 4 years, 2 months ago by Mad Max.
    • This reply was modified 4 years, 2 months ago by Mad Max.
    • This reply was modified 4 years, 2 months ago by Mad Max.
Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Customize code/position of reset and autolocate buttons’ is closed to new replies.

Views