Special chars displayed wrongly in caption

Hi, can you share a link to a page where this can be seen live?

I had to manipulate an older existing site to show this as the site that I am experiencing it on is not live yet.
If you look at https://www.rianne-lampers.nl/vakantiemijmeringen-1/ you will see a gallery below the text. The first image has hover text “??Op weg naar de Giant’s Causeway – 1”. The caption reads “?¤??Op weg naar de Giant’s Causeway – 1”.

Please reply when you did the analysis so I can remove the two extra added characters at the start of the title. I will also remove the url above to avoid spammers of getting hold of it.

OK, looking at the page source I see that the issue is already there in the markup. The start of the image link tag is this:

<a href="/wp-content/uploads/2010/09/2010_f1838_Op_weg_naar_de_Giants_Causeway-1.jpg"
 class="fancybox image gimglist_a" rel="enviragallery353_gimglist"
 title="&Atilde;&curren;&Atilde;&laquo;Op weg naar de Giant's Causeway - 1"
 data-envira-caption="&auml;&euml;Op weg naar de Giant's Causeway - 1" ...

Notice the title attribute how it is different from the data-envira-caption attribute.

Does the development site use the same Envira Gallery plugin maybe?

• This reply was modified 7 years, 10 months ago by Rolf Allard van Hagen.

This site uses Envira Gallery Lite. I have written my own script to pick up the DOM and manipulate it to display in one line and only the first so many images. I do no updates to the title or alt.

If I look at the HTML I also see:
<img id="envira-gallery-image-650_gimglist" class="gimglist_img gimglist_img_1" data-envira-index="1" src="https://www.rianne-lampers.nl/wp-content/uploads/2010/09/2010_f1838_Op_weg_naar_de_Giants_Causeway-1-300x227.jpg" data-envira-gallery-id="353" data-envira-item-id="650" data-envira-caption="??Op weg naar de Giant's Causeway - 1" alt="" title="??Op weg naar de Giant's Causeway - 1" itemprop="thumbnailUrl" data-envira-srcset="https://www.rianne-lampers.nl/wp-content/uploads/2010/09/2010_f1838_Op_weg_naar_de_Giants_Causeway-1-300x227.jpg.......

When I mouse hover over the image I see the correct title with normal special characters.

So what can I do?

I might add that I just tested using special characters in a gallery that is not manipulated by my script.
The special characters show up correctly in the Fancybox pop-up. So I guess this has to happen when I read the DOM, manipulate it and write it back………..

I will investigate and report back!

It sounds like it could be related. What is the script that you use to manipulate the DOM?

I found the error! It was in Envira Gallery Lite.

I am using the envira_gallery_output_end hook to get the entire gallery.
I read the whole gallery as a DOM to add a css class and let only display the thumbnails for 1 horizontal line of the gallery. The rest can be seen through Fancybox display.
In that process I also remove the Envira script added to the footer.
That script currently contains a rewrite of the title from attribute data-envira-caption. So removing it gives me the output basically created by the plug-in i.e. a title with wrong special characters.
I now extended my PHP script to pick up the data-envira-caption attribute from each anchor and setting the title with it.
Problem solved!

Sorry for the inconvenience as Easy Fancybox had nothing to do with it!

• This reply was modified 7 years, 10 months ago by Harm10.