Why Good JavaScript Code Is Critical To Your Locator

Whether you are using our MySLP SaaS service or our WordPress plugins for Store Locator Plus, having a web page that is loading “clean” JavaScript code is CRITICAL to the functionality of your locator.   Most web pages today, and certainly those including an interactive map, are far removed from static HTML and images.   Today’s web pages are full-on applications.   They are programs that are running locally on your device to draw a page that looks similar to the old-time static HTML pages but with a lot more cool interactions; like maps.

While these new interfaces are cool and certainly make the web easier to use they come at a cost.   It requires that all of the little mini-applets that you are loading on a page to show to your users play nicely together.   Every single interactive component like that Google Ads sidebar, the Recaptcha validation and maps are all separate programs that are playing in the same “pool”.    The problem with this is that it is very easy for any one of those components to “go haywire” and spoil the fun for everyone else.

Part of the issue is that for most web page builders you have ZERO control over WHEN you get your turn to jump in the pool.   Do you get in first?   Or do you get in after someone left their “code turd” in the pool?   How well your app runs can depend a lot on WHEN it gets to run.  To make matters more complicated an interactive page may not “sprout new problems” until AFTER the user starts interacting with the page.   Maybe it happens when a user clicks on an ad that is being tracked which then breaks the code and all subsequent JavaScript is running in a “polluted pool”.

Often the Store Locator Plus map is the most visual an interactive element on the page.  It happens to be what most people notice first when JavaScript is broken.   You won’t notice if your ad-click is not being tracked but you sure as heck notice when you try to look up locations and the map doesn’t change.    Often the cry goes out “you broke the locator” when many times it is something else that broke well before the locator had a chance to do its work.

Check For JavaScript Code Errors

Use your web browser developer tools.   All modern browsers have this functionality and it can give you some clues as to what is really going on.    If you see errors in the console you will want to clean this up and see if it resolves the issues with the locator.

Safari

Go to Safari | Preferences | Advanced and click “Show Develop menu in menu bar”.

Safari Turn On Dev Tools
Safari Turn On Dev Tools

 

To check your JavaScript Console go to Develop | Show JavaScript Console

Look for any red exclamation marks and look at the error logs to suss out JavaScript code issues.

JavaScript Code Errors In Web Console
JavaScript Code Errors In Web Console

Firefox

Older versions of Firefox have the web developer tools enabled by default.  If you do not see the Web Developer menu option check under the Settings menu a this may be disabled by default in future releases.

To view possible JavaScript errors:

Go to Tools | Web Developer | Web Console

 

Learn More In This Video

Check out this video to learn more about the technical details of why JavaScript loading order and errors in other JavaScript code is important.

 

If you are not seeing JavaScript code errors on your page and your Store Locator Plus map is still not working please contact us!

WooCommerce Interface Updates

For our WordPress plugin users the Premier add on has been updated to 4.9.1 today to address several issues.  The WooCommerce interface has been patched to fix a problem for users on non-English sites.    Version 4.9.1 also has been re-tooled to work with PHP 5.3, though you really should be running PHP 5.6 as a minimum.

MySLP Enterprise users will be getting the button bar in our year-end update of MySLP.

Button Bar Category Selector

The new Button Bar category selector, introduced in our previous release, now honors the “hide empty categories” setting.  However, unlike the other category selectors using a drop down selector coming from WordPress Core, our custom button bar interface behaves more along the lines of how we think it should.  With the button bar a category is considered empty only if no locations are attached to that category.

How is that different?  A little more explanation is warranted.

A Button Bar On A Customer Site
A Button Bar On A Customer Site

Hide Empty Categories

This is a setting that is available via the Power addon.  Yes, the Power add on.  I know we are talking about Premier here, but let’s forget about that detail for now.   Premier only adds some new user interfaces to the underlying category features provided by Power.

The Power add on allows you to attach categories to locations, such as “put all these locations in the wholesale category” and “these go in the retail category”.      You can then provide an easy way for users to filter the locations they see on your map by selecting whether they want to see retail or wholesale locations.    The default category selector , if you choose to show it, is a simple drop down menu that shows any categories you’ve added to Store Locator Plus.

Normally ALL categories you’ve created are shown. Even if there are NO locations that exist within the category.   If you have NO wholesale locations and someone picks that from the drop down category selector they see no results.

A long time back we added a “Hide If Empty” option for the category selector.   However there is a big “gotcha”.   It uses the WordPress built-in functionality for category drop downs since we didn’t want to rewrite their huge category drop down menu library.  No need to re-invent the wheel.   BUT this built-in selector has a rather unique way of defining what is an empty category.  For WordPress a category is empty if everything assign to the category is in draft mode.

Draft Mode? What?

Yes, draft mode.   We also did not want to write our own custom category engine.  Actually, to be honest WE DID do that back in Store Locator Plus 1.0.  It was a disaster.  Why recreate something built into WordPress?   Around SLP 3.0 we converted everything to use the WordPress category system.   That system uses a lot of underpinnings from pages and posts.    I think you can see where this is going.

What does that mean for hide empty?

As noted in a little not on the Hide Empty checkbox, this feature ONLY WORKS IF PAGES ARE ENABLED.  Yup, if you are using Hide Empty to not show some things on that category drop down you must ALSO be using Pages ( Enable Pages is under the General tab, BTW).     Not only that but you must change the default to be PUBLISHED instead of draft mode, which creates public SEO friendly pages for every location in your database.

You need to do that because if you don’t the WordPress category drop down creator will consider every page set to draft or private mode to be “unused” , which means those locations are not counted as part of the category.

So… The Button Bar Hide Empty

If you are using the button bar to show a category selector you can also use hide empty.   Empty means NO LOCATIONS are using that category.

For the other category selectors, like any of the drop down selectors, the old-school “it is empty if pages it not enabled” still applies.  We’re working on fixing that in the Power add on in a future release.

Power 4.9.1 Improves Location Import

Store Locator Plus Power 4.9.1 improves location imports. It is available for WordPress now and will be updated in our end-of-year release for MySLP users.   Here it what was patched and improved.

All Users (MySLP and WPSLP)

Address 2 column on CSV import files was incorrectly being mapped to the address field.   This has been resolved.

The location import processing has vastly improved progress indicators on the import sub tab.  Check them out.

Power 4.9.2 Import Processing Progress
Power 4.9.2 Import Processing Progress Bar

WordPress Specific

Store Pages custom post types , that are included with Power, correctly registers with WordPress 4.9 showing the sidebar menu.

Power has been updated to work on servers running PHP 5.3.  You really should upgrade to PHP 5.6 if you value site security, not too mention performance.  PHP 5.3 has been out-of-date for several years now.  Actually jump right to PHP 7 if you can.

General Notes

Import and Basic Auth

The new import process requires that your site be able to run WP Cron.  Some hosts and site admins turn that off for “security reasons”, but there is limited-if-any security risk with that process.  Not running it not only will prevent the new imports from running but stops lots of other things from working in WordPress; like automated updates.

If your site is using basic authentication, you’ll know if it is, the import processor cannot start the second (reading the CSV file) and third stages (geocoding locations) automatically.    You’ll need to be logged in as an authorized user and surf to your website/wp-cron.php to kick things off.     Some development and staging sites use basic authentication to prevent a casual web surfer or search bot from accessing a site they are working on.

Marker Not Found Notice On Settings Page

If you are seeing “marker not found” notifications when going to your Settings tab in SLP, this could be an obvious indication that basic auth is running on your site.    Our marker-testing uses the built-in WordPress “get this web thing” function which access something, like your marker URL , as if it is a “Joe Public” web user just surfing the web WITHOUT typing in special access codes or passwords.     As a side note, if you are seeing that notification there is a good chance that someone visiting your site with a browser you’ve not tested yet is getting a map with no markers on it.

Tag Based Location Searches

No, we’ve not completely fixed the TAG search in this release.   The tag searching is better, but still not 100%.  We are actively chasing down that bug and a few others for the SLP 4.9.2 + Power 4.9.2 release.

Other Updates

We are working on getting Premier to run on PHP 5.3 servers (you ARE going to upgrade to PHP 5.6, right?) along with some other minor patches.

If you have issues please post in the forum (this shows up in our dev teams Slack channel) or Contact Us via email.  If using the forum, please start your own thread if you are sharing information about your site and want help debugging.  Include a link to your locator page and copy the content of your plugin environment (for WPSLP users) or profile (MySLP users).

Keep in mind that if you updated OTHER THINGS like WordPress, another plugin, or a theme… those can break Store Locator Plus.    SLP is the most visible thing you’ll see if your JavaScript breaks as the search form stops working.  Nobody usually notices a slide-out menu not sliding out but a search for locations is front-and-center.   Check your browser’s developer tools and look in the console for error messages.   We’ve had several sites update things like their them which was missing a library, such as Lightbox, that breaks JavaScript and stops the locator from running.