Waymark icon indicating copy to clipboard operation
Waymark copied to clipboard

Maps wont load on a gutenberg template

Open YosoraLife opened this issue 1 year ago • 6 comments

Hi Joe,

I've been running into an issue with displaying a map through a shortcode. When I include a Waymark shortcode (either a single map or a collection map) on a gutenberg template it wont load. I've already been trying to find the problem but i can't find the problem. I've also tried it on a fresh wordpress install with the same results. Do you have any ideas?

Cheers, Remco

YosoraLife avatar Jun 14 '24 19:06 YosoraLife

To clarify, the data does get loaded, only the map doesn't

Screenshot 2024-06-14 213547

YosoraLife avatar Jun 14 '24 19:06 YosoraLife

Hi @YosoraLife,

Thanks for reaching out and I am sorry to hear you are experiencing issues.

I've already been trying to find the problem but i can't find the problem. I've also tried it on a fresh wordpress install with the same results.

Could you provide a link so I can see this behavior, or an example of a Gutenberg Template that I can use to replicate this?

Cheers,

Joe

morehawes avatar Jun 14 '24 23:06 morehawes

Sure, the page where is try to implement this is: https://yosora.life/map-collection/travels/

YosoraLife avatar Jun 15 '24 09:06 YosoraLife

Hi @YosoraLife,

Thanks for the link. Looking at your page source, I can see many occurrences of the following Waymark generated HTML located within the Map content:

<div class=\"waymark-description-link\">\t<span class=\"waymark-map-link\">

I am not sure how or when these are being added, but this is preventing the data from being loaded. I have not seen this one before!

A couple of thoughts:

  • Was this HTML included in the original file imported into Waymark? (perhaps it was Exported and then Imported?)
  • Try changing the Settings > Advanced > Collection Options > Shortcode Method Setting

If you are still having issues, please can you provide me with the minimal steps (and data) to reproduce this issue.

Thank you for your patience.

Joe

morehawes avatar Jun 15 '24 14:06 morehawes

Hi Joe,

Thank you for your quick reply.

Was this HTML included in the original file imported into Waymark? (perhaps it was Exported and then Imported?)

No, I make individual maps, added (photo)markers and none of them have any (custom) html. To make it even stranger: I made a regular Wordpress page and added the exact same shortcode and it works: https://yosora.life/test-page/. Although I also found a new problem, on 1.3.1 the map only show the latest map. I downgraded to 1.2.0 and then all (9) maps are shown, only with 1 map is shown in a different world like this issue: #35 . Do you want me to make a new issue for the problem with only showing the latest map?

Try changing the Settings > Advanced > Collection Options > Shortcode Method Setting

I tried this but is had no effect.

If you are still having issues, please can you provide me with the minimal steps (and data) to reproduce this issue.

My theme is a child theme of the default Wordpress Twenty Twenty-Four theme. But I can also reproduce the problem in a default Twenty Twenty-Four theme setup.

  • I made a map as normal
  • Added that map to a collection
  • Take the Collection shortcode
  • Go to Appearance > Themes > Twenty Twenty-Four > customize > Templates
  • Add a new template (+ next to Templates) > Collection > Pick the collection from step 3
  • You are forced to choose a pattern as basis, but you can edit that using the block editor
  • Add shortcode block with the Collection shortcode
  • The page can be viewed at [domain.com]/collection-slug/collection-name

I hope that makes any sense ;) if it would be any help, I have a stock test site I can give you access to.

Thank in advance for your help

YosoraLife avatar Jun 16 '24 18:06 YosoraLife

Hi @YosoraLife,

Thank you for the level of detail. I followed your steps on two different WordPress installs and was not able to get a Map to display at all!

This is my first time using the Gutenburg Template interface, so I think the fault is with me. However this means I have not been able to replicate on my end.

If you have access to modifying your theme this shows how to display the Collection Shortcode on the Collection archive page.

I hope this helps.

morehawes avatar Jun 21 '24 18:06 morehawes

Hi @morehawes,

Sorry for the late reply but I had some personal things holding me up.

I did finally manage to find the issue and I also found a work around for it. The fault is in the way that the shortcode block from the Gutenburg Template works. That shortcode block automatically adds </p> that messes up the code, most notably with the markers description:

non-Gutenburg shortcode image Gutenburg shortcode image

Normally you would be able to disable that behavior by adding remove_filter( 'the_content', 'wpautop' ); but this doesn't seem to work on the Gutenburg template. Instead either a custom Gutenburg block needs to be made or you can load the shortcode in a custom html block instead of a shortcode block.

This was the answer that helped me to find the solution

YosoraLife avatar Nov 03 '24 15:11 YosoraLife