Grey map after update

[Pt]

Hello,
I’m trying to get rather an old install up to date and working with the latest Google API requirements. The site is at http://johnshearer.com.au/dealers/

Have updated the plugin, WordPress and core theme to their latest versions and setup the new API key with billing account. After installing the API key in General > Server, I’m getting locations populated on an all-grey map.

I’ve seen this before when migrating other client’s sites up to the latest version of everything but in those cases there was always a Javascript Console error to let men know what bone-head mistake I was making. In this case, there is what seems to be a jQuery error and I’m not sure how to proceed.

Please see below for install details and the error message.

Plugin Environment:

Store Locator Plus™:4.9.18
Site URL:http://johnshearer.com.au
This Info Cached:1535424861
Network Active:No
WordPress Version:4.9.8
PHP Version:5.6.37
MySQL Version:5.5.5
PHP Limit:1024M
WordPress General Limit:1024M
WordPress Admin Limit:1024M
PHP Peak RAM:73 MB
PHP Post Max Size:64M

Javascript Console error is as follows:

TypeError: Argument 1 of Node.appendChild is not an object. – jquery.min.js:4:4520
clean
http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:4:4520
f.buildFragment
http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:4:2301
domManip
http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:4:1670
append
http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:3:31813
html
http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:4:763
slp.setup_helpers/String.prototype.shortcode_modifier
http://johnshearer.com.au/wp-content/plugins/store-locator-le/js/slp_core.min.js:1:6444
slp.setup_helpers/String.prototype.replace_shortcodes/<
http://johnshearer.com.au/wp-content/plugins/store-locator-le/js/slp_core.min.js:1:3749
RegExpGetFunctionalReplacement self-hosted:4888:5 RegExpGlobalReplaceOptFunc self-hosted:4969:23 [Symbol.replace] self-hosted:4757:24 replace self-hosted:5507:13 slp.setup_helpers/String.prototype.replace_shortcodes
http://johnshearer.com.au/wp-content/plugins/store-locator-le/js/slp_core.min.js:1:3004
slp_Map/this.createSidebar
http://johnshearer.com.au/wp-content/plugins/store-locator-le/js/slp_core.min.js:1:22596
slp_Map/this.putMarkers
http://johnshearer.com.au/wp-content/plugins/store-locator-le/js/slp_core.min.js:1:15569
slp_Map/this.process_ajax_response
http://johnshearer.com.au/wp-content/plugins/store-locator-le/js/slp_core.min.js:1:20907
slp.send_ajax/<
http://johnshearer.com.au/wp-content/plugins/store-locator-le/js/wpslp.min.js:1:162
n
http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:2:14779
fireWith
http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:2:15553
w
http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:4:11393
d
http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js:4:17218

Thanks for your time,
Peter.

[Cici]

something broke javascript, most likely a theme or another plugin.   You can deactivate all and only use WP theme on a staging site to see which one is broken.  You can also use a tool such as the debug WP.

Here is some troubleshooting guidance and suggestions.

[Pt]

Thanks Cici,

I’ve copied the site over to a development directory, switched to twentyfourteen and disabled all plugins expect SLP and WordFence.

http://dev.johnshearer.com.au/dealer-test/

Now, I’m not getting any error in the web console at all but still a grey map.

I’ve also gone through Google Cloud Platform and turned on every maps API that seems even vaguely right. That didn’t work, so I tried unrestricted API keys form another site using SLP which doesn’t have the issue. Still no dice.

Furthermore, I’ve freshly grabbed the latest plugin files from https://wordpress.org/plugins/store-locator-le/ and replaced the copy on the server, just in case something was corrupt.

Any further suggestions for troubleshooting?

[Cici]

It also looks like on the original site you had proPack as well..the old site with new version of SLP will n0t work you must delete Propack. That is a legacy add-on. You have append child errors on your original site, so  I am guessing that you have a child theme and perhaps it is trying to build using the CSS  template that used to be part of ProPack (?) but ProPack will not work with SLP version 4.9.xx and Power add-on does not contain  CSS options.

Do you have the WPdebug on in the test site?  by inspecting it using a regular ol inspect site tool from the front end it appears to be on, or was on when I looked.  But I do see under  the AJAX headers for the  option map type./..nothing is set there.   It should show roadmap or satellite, or whichever you set in SLP under MAP settings.  If you cannot change it or if you do not see it  You can download Janitor for free and see what all the settings are.

If you do you might want to use janitor to rest the options, something did not carry over correctly to your test site.

Visit the Google server key post in docs that should help you get the right Google API key if that is an issue, but I looked at your test . with wordFence, make sure it is not blocking communication between SLP and Google browser

 

 

[Pt]

Hi Cici,

Switching the map type to hybrid and back to roadmap has fixed the grey-map issue on both the live and dev sites.

proPack has been deleted on the live site and never made it over to the dev site. It had been deactivated but not removed some time ago.

Once the map was rendering, I noticed that not all results were being shown while the child-theme was active. That JavaScript error originally described was also still present with the Child Theme turned on.

At some point I “fixed” something by forcing an older version of jQuery. Admittedly, this was only the second WordPress site I ever built and I cringe every time I look at how I put it together. Hopefully the client will go ahead with a rebuild later this year.

For anyone else not seeing all results or seeing strange JS errors, check your jQuery version.

Thanks Cici for your quick response and excellent diagnostic assistance. I doubt I would have fiddled with the Map Type setting without your prompting.

Cheers,
Peter.

[Cici]

Good to know. If you feel the support was useful could you leave me a fiver in the WPSLP directory here?

It will put me in the good graces of the developer . I am not a coder or developer so there have been a lot of trial and errors on my end.

What version of jquery are you being forced to use?  WP requires 1.12 min for some time now. And even that is too low according to the developers posting in the WP support forums.

You are taking over an old site that someone else built and that is not an easy task. I think the child theme on that site must have been using outdated jquery or maybe had some customization.  There should  never be a situation when you have to use outdated jquery to get functionality back.  That theme developer needs to update or perhaps you can convince your client  to use a different theme if the orig. developer is not responsive or if it has been orphaned.

Javascript best practices

If your client needs CSS functionality specifically for WPSLP, you should have them buy Experience add-on.  If they need categories, import, export, , they need Power add-on.  The best value would  be the Premier subscription if they are going to want to manage the WPSLP themselves  (they would be responsible for their own API key and also the updates) or better yet IMO   swap over to MYSLP.

Documentation home page shows the info for the two side by side.

MYSLP does not have the SEO Pages functionality that is available with the power add-on but your customer wasnt using that add-on anyway from what I saw..

With MYSLP, it is simply embed some script on the page and the locator updates are managed by SLP (and the Google API  is under MYSLP no need to worry about them)  It is a subscription base service . If  they need categories , special layouts,  or have a lot of locations they would need the Professional level plan.  It works with WP but also with Squarespave, Weebly, etc.

 

 

[Author]

Posts