Search Form Labels

 Set the Labels for the Search Form

The label that will be displayed in front of the Search form box on your locator page can be changed under Settings/Search in the Appearance section Label. If none are set, a blank box will appear on your site. The “Address” Label you enter will appear in front of the search box. The “radius” information indicates to the site visitor that this is the radius (whatever radii you entered in the search form  for radii options.

Consider this label as  a help text tool for the site visitor to assist them as to what  to enter in the box.   Label Examples:  zip code, city, street, or a combination such as  address / zip code.  The more detailed the better. We find address and zip code to be the most useful hint.  If you leave this label blank nothing will appear in front of the search form box and your site visitors will be guessing what to enter to start their search.

Additional Search settings and labels are available with MYSLP Professional or Enterprise level or the WPSLP self managed with the   Experience or Premier add-ons.

With the WP Add-ons or the MYSLP SaaS professional level plan and higher you will find additional help search boxes such as Address Placeholder.

Search by Name

Additional Search settings are available if you are using either:

Word Press Store locator Plus plugin with the Experience Add-on , or  the Store Locator Plus SaaS / Professional level plan.  have multiple search tool options to display on the front page when a site visitor lands on your locator page. Search by Name is a checkbox that is found under the Store Locator Plus “Settings/Search” menu.   

The default is “Name” 

 

Appearance Layouts

Experience Add-On or Professional level MySLP SaaS

The Experience Add-on  for WordPress SLP plug-in , or the Professional level or higher plan for MySLP Software-as-a-Service application allows you to customize the layouts, the map interface, and the search form to display in a certain manner on the front end of your locator page

Search Layout

Search Layout is found under the Settings tab on the Search panel.

This setting allows the search form layout to be modified via a text setting.   If the Search Layout field is left blank the default search form layout and  your SLP style is used.   If Search Layout is modified the layout will take precedence over most of the Search Form settings  and the basic Store Locator Plus.

Store Locator Plus Discrete Searches

The Experience add-on  for WordPress SLP or the Professional level Plan for MySLP SaaS provides a “search by city”, “search by state”, and “search by country” feature.   This search form element, when enabled, will build a drop down list based on the locations in your database.   This is meant to provide a hint to the user where your locations are.

The Advance level or basic SLP  search button  looks for locations closest  based on your other search form settings.  If your default radius is 100 miles and the user selects the state of Texas, the base plug-in will search for all locations within 100 miles of Google’s estimated “center of Texas”. With the Professional level plan  you can select certain settings to redirect the search selector and provide other options to direct or assist your site visitor.

Horizontal | Vertical Checkbox Category Selector

*Included with  WPSLP Premier subscription or MySLP Enterprise level Subscriptions.

The Horizontal or Vertical Checkbox Category Selector feature is available for WPSLP Premier or MySLP Enterprise level subscription customers. The checkbox works with an “OR” selection based on the Parent category.  With Premier or Enterprise you will see additional category selectors under the Settings/Search/Category section. For example : If you check the [] red and [] blue boxes on the category selector it will show any location in the red OR blue category.

Search Address Auto-complete setting

Feature to have the address to auto-complete the zip code based on your location database is available with the Premier/Enterprise or the Experience add-on

When 2 or more characters are typed in the address input box,  input suggestions based on location data will appear.

  • None (default) – do not suggest address input.
  • Zipcode – suggest matching zip codes.
  • With Premier or SLP SaaS Enterprise you can also have a zip code drop down selector

If the formatting of the autocomplete is not  the way you would like it to appear, reset the Search Form Style under appearance layout.

Locator Styling determines how the auto-complete drop down box will appear on your page.

Search Form Style

Search Form Style sets the styling for the interactive locator elements on your site.   It uses pre-built jQuery Theme Roller style CSS designs to create a simple way to style interactive elements such as the autocomplete feature (available in WPSLP Experience or with MySLP Professional) on the address box. with Experience or Professional level plan additional search elements are available, including a one click checkbox to “Hide the search form”  altogether.

The default styling is set to “None” which provides not special styling rules from interactive JavaScript elements in the locator interface.   This allows the site designer to create their own styles for the website in which the locator will be placed.

Search Form Style Default None 2017-05-23_16-20-30.png
Default styling for autocomplete is “none”.  The theme in this example does not specifiy any ui-autocomplete styling. The background inherits the transparent background used by the website as the default for all divs.

The base service also includes the Base jQuery theme.

Setting A New Style

For WordPress plugin users go to the Store Locator Plus selection on the sidebar menu.

For MySLP users go to Store Locator Plus sidebar menu.

Select Settings/Search from the tab list.

Scroll down to the Appearance section and expand it by clicking the word “Appearance” if necessary.

Select a new style from the Search Form Style drop-down menu.

Available For WPSLP and MySLP

Search Form Style is a feature that is included in the base plugin of Store Locator Plus for WordPress and is available under Store Locator Plus for all levels of the MySLP service.   Premier members on WPSLP and Enterprise Level users for MySLP will have multiple options for the Search Form Style.

Layout Shortcode Cheat Sheet

Results Layout ShortcodesThe Experience Add On allows you to custom tailor the look and feel of the Store Locator Plus plugin on your site.   To accomplish this the plugin uses a combination of HTML and special shortcodes.   These can be changed or checked off under the Settings* tab  the plugin.

* formerly referred to as Experience tab, if you do not see Settings in the UI you are not using the latest version of Store locator Plus

The Overall Layout

This is set via the View / Layout setting.    It determines the overall layout for the plugin based on 3 primary components: The Search Form, The Map, and The Results.

Gray map or blank map and/or search does not work

JavaScript Problems:

Note: Major Updates to WordPress versions (example 5.0 , 5.5 ,5.7) may effect themes behaviors and plug-ins and cause additional errors. We strongly advise updating on a staging site or dev or  test site first instead of allowing AUTO UPDATES)

Many times we hear that an update to SLP plug-in  broke “everything”.  Upon asking  for clarification  we find out that they also updated WP and/or  other plugins or did not update their themes.   WordPress explains how to  use your browser to diagnose javascript error

Issues with the JavaScript part of the plugin usually manifest themselves by showing the search form but either a blank map, a map that is all gray, or a map that appears but search does not wor properly. To identify what is causing your issue use the Firebug add-on with Firefox or any Browser developer tools (see above info in the link to WordPress on how to diagnose with browser).

The WordPress Store Locator Plus map rendering is managed by the slp.js JavaScript file.  It sets up the communication with the built-in WordPress AJAX handler, admin-ajax.   Your server must be setup to allow the built-in WordPress AJAX handler to execute.  Additionally, ANY PLUGIN or THEME that is breaking javascript will break SLP functionality. This is rarely an issue with the SLP plugin.

Common errors or issues:

The PHP JavaScript connector did not load

We have come across this error on several installations. The short answer to this problem is that something in the WordPress installation prevented the Store Locator Plus JavaScript component from loading. This means that the map system cannot communicate with Google. This prevents the map from appearing and search results from working properly on your locations page.

Here are some issues we’ve come across that cause this to happen:

    • PHP version is < 5.3, this generates an error message that you will not see in the browser. Any error message will prevent the JavaScript PHP file from loading. SLP will not work with versions lower then PHP 5.3.
    • PHP Error Reporting Enabled, if PHP error reporting is enabled and ANY PLUGIN has bugs, uses deprecated WordPress functions, or uses deprecated PHP functions they will generate an error message. This error message can be hidden in the browser if the error happens in something that is creating page header information. This will also break the page loading process and prevent the JavaScript PHP from loading.
    • Plugin Errors, any plugin that does not load properly and does ANYTHING with page header output will break and thus cause a domino effect prevent the Store Locator Plus PHP JavaScript component from loading.

In many cases the cause of the maps not loading is because our PHP JavaScript file could not load. We can often detect this and pop-up the “PHP JavaScript connector did not load” warning. However we cannot catch all errors. Why good Javascript is critical.

One of the best tools for searching for errors in the HTML page headers is to use Firefox with the Firebug plugin or any browser developer tool. Turn on the console and check the responses tab under console for any errors. We have resolved many client installation and map problems with this plugin. More often than not we are finding errors in other plugins, themes, or server/site  configuration settings.

The PHP JavaScript page header is a critical part of a working Store Locator Plus installation. Since it loads very late in the page creation process it is susceptible to failures from almost anything else you may be loading on the page or your WordPress site. The the map is not loading and you are receiving this message get some page debugging/tracking tools like Firebug and isolate any plugins that are generating coding/output errors.

IF YOU Update your WordPress environment , BE SURE TO  review  the WordPress VERSION changes  as they have changed.

Review the WordPress suggested requirements

  • Update PhP to 7 or higher
  • Update MySQL to 5.6 or higher
  • Site move to HTTPS 

2017 was  the year  WordPress was requiring   hosts to have HTTPS available. Just as JavaScript is a  necessity for smoother user experiences ,  updated PHP versions are critical for performance,  and SSL just makes sense as the next hurdle  users are going to face.   Note: Google also weighs SSL as a search engine ranking factor and have begun flagging unencrypted sites in Chrome.

The [slp_search_element] Shortcode

The [slp_search_element] shortcode is only processed within the Search Layout setting.   It is used to display user input elements on the search form.

Attributes

Attributes are the keywords that appear after the opening [slp_search_element and before the closing ].

Default attributes include:

button=<slug>

Output a form button.  <slug> should be an input supported by the base plugin or an add on such as:

submit

Output the Find Locations button.

[slp_search_element button="submit"]

 

dropdown_with_label=<slug>

Output a dropdown selector with a preceding label for the specified input.  <slug> should be an input supported by the base plugin or an add on such as:

radius

Output a dropdown of radius selections based on the Experience / Search / Radii Options setting.

hard_coded_value=<value>

Outputs the specified value.  Used by some add ons to add a specific [slp_search_element] output.

input_with_label=<slug>

Output a input selector with a preceding label for the specified input.  <slug> should be an input supported by the base plugin or an add on such as:

address

Output a the address/zip-code input box.

Tech Geek Stuff

Processed by the SLP_UI class via add_shortcode in create string_SearchForm() which calls crease_SearchElement().

Filter shortcode_slp_searchelement is used to manipulate attributes.  Many add ons use this to render specific output using attribute ‘hard_coded_value’ => ‘xyz’ to output a specific value.