vdhooft

Thanks, Camille for your really quick reply.
And yes, your plugin is quite fast, but still, I would like to make my page load faster. Without including a map I have a google PageSpeed Insight for mobile of 99. With a map, it falls to around 80. My goal is to make it as high as possible in preparation for the google may changes.

You are correct with the ajax shortcode load. I can make it work for some, but not in this case. I also tried using an iframe (you can defer an iframe without any problems). This gives the best “speed” result. But it needs some code to make the centering work well. And the problem is clicking on the items.

The solution that you gave works well. I start the map with a 5-sec delay. The page speed score is not as high as with an Iframe, but a lot better than when the map loads immediately.

For others that like to do something similar:

jQuery(document).ready(function($) {
   setTimeout(function() {
	console.log("Start map auto...");
	if (document.getElementsByClassName("travelersmap-container")) {
		initTravelersMap();
	}
  }, 5000);
});

Thanks again for your help! 🙂

I use UTF-8, so that can not be the issue.
I know that very often word content is being copied into Gutenberg text blocks, and word often uses curly quotes. For this reason, I use a plugin “Smart Quote Fixer” (Plugin for fixing smart quotes and other symbols from MS Word before it goes into the database).

I did some further debugging. I added a console.log in travelersmap.js, just after the “json_cttm_metas.replace” and before the “JSON.parse”. Than I get the json.
The error I get is:
SyntaxError: JSON.parse: expected ‘,’ or ‘}’ after property value in object at line 1 column 4676 of the JSON data travelersmap.js:209:25 (some more content is added since the first post).

When I go to 4676 I see this:

“excerpt”:”Overland Park is located in Johnson County, it is a beautiful city and a good spot for families. This city topped the list of “Top 10 Best Cities for Families””}},{“markerdatas”:”{\”latitude\”:\”33.43073\”,\”longitude\”:\”-79.
I copied some more. You can see that the problem is with “Top 10 Best Cities for Families”.

When I go to the post and look at the HTML (standard Gutenberg text block) I see this:

<p>Overland Park is located in Johnson County, it is a beautiful city and a good spot for families. This city topped the list of “Top 10 Best Cities for Families” in 2015. It has always had a positive reputation in American Media as an amazing city to work, live, and play. The city is densely populated, with many attractions that one can explore during their stay. This city definitely won’t be a disappointment.</p>

So the HTML and the excerpt in the JSON match.
When I change the double quotes for single quotes in the text the problem is not there.

My wp-config.php contains this: define( 'DB_CHARSET', 'utf8mb4' );

I hope this helps to find why.

• This reply was modified 5 years, 9 months ago by vdhooft.