Hello @malae,
Thanks for reaching out to us!
I was not able to replicate this behavior on my end.
It might be an issue caused by a plugin or your theme.
I recommend installing this plugin: https://wordpress.org/plugins/health-check/
After you install and activate the above plugin it has a Troubleshooting mode that allows you to have a vanilla WordPress session, where all plugins are disabled, and a default theme is used, but only for your user; your visitors will still see the normal website.
Go to its troubleshooting mode and only activate FancyBox for WordPress and see if it works correctly with a default WordPress theme (Twenty Twenty-Five, for example) and no other plugins.
Please let me know how it goes and what you find!
Warmly,
Beatrice.
Thread Starter
Malae
(@malae)
Hello Beatrice,
Thank you for your prompt reply. For the record I have WordPress 6.8.1 with PHP 8.3 and use the Firefox browser. I also have a very different site, but with the same theme, which has the same caption problems with Fancybox.. The theme is Twenty Thirteen, which was the latest theme when I first built the sites. I have a child theme and also keep Twenty Nineteen installed (not activated) ready for occasions such as this.
I followed your suggestions and, on clicking images with Twenty Nineteen installed, they all displayed with no captions. This was also the case if I switched to Twenty Thirteen or Twenty Twenty Five themes. Only the Fancybox ver. 3.3.6 plugin was installed and the browser cache was cleared after every change.
After the above checking, I tried to disable the Troubleshooting mode, but after many tries and clearing browser caches I gave up and deleted the Health Check plugin using FTP. To my surprise, even after clearing the server cache, there was no change on the page and Health Check Troubleshooting remains active on the page and the site is displaying normally on an Edge browser. Searching this on Google I found that others had faced this strange issue and some also still facing the problem after deleting the Health Check plugin using FTP.
Thread Starter
Malae
(@malae)
I was unable to continue checking yesterday and only solved the Health Check Troubleshooting issue. I found that the issue was caused by something in the CSP headers, which I disabled. After that I reinstalled the Health Check plugin and was able to deactivate the Troubleshooting mode. and the site was back to normal.
Today I took the site offline and, without the Health Check plugin, disabled all the plugins except for Fancybox. I checked version 3.3.6 with the Twenty Thirteen theme with and without the child and also the Twenty Nineteen and Twenty Twenty Five themes. All displayed the scrambled captions as in the screenshot. I also tested with and without the Classic Editor. Rolling back to version 3.3.5, all captions were normal. These tests were done both with and without the CSP Security Headers installed.
Hello @malae,
Would you mind sharing a few screenshots of your Fancybox settings, especially any that relate to captions or overlays?
Thank you,
Beatrice.
Thread Starter
Malae
(@malae)
Hello Beatrice,
Please find screenshots of the relevant settings pages.
https://imgur.com/a/DGwny9O
No changes were made before or after updating to ver. 3.3.6 or reverting to ver. 3.3.5.
Hello @malae,
Thank you for the screenshots!
We managed to replicate this behavior on our end. I opened a ticket with our development team regarding this issue, and it will be fixed in a future update.
Apologies for the inconvenience and thanks for bringing this to our attention!
Warmly,
Beatrice.
-
This reply was modified 11 months, 1 week ago by
beatrice12.
Thread Starter
Malae
(@malae)
Hello Beatrice,
Thank you for your reply. Your prompt attention is much appreciated.
The issue is now fixed in the recent update. Please update the plugin and report back if everything is working just like it should.
Thread Starter
Malae
(@malae)
Hello Silkalns,
Thank you for your advice about the new update. I installed version 3.3.7 and have added a screenshot (bottom).
https://imgur.com/a/DGwny9O
No other changes were made. The caption is not as scrambled and does not overlap the image, but coding is still inserted with the caption.
Hello @malae,
We tested this with the latest version and everything is working properly.
Can you please clear your website’s and browser’s cache and check again afterward?
Warmly,
Beatrice.
Thread Starter
Malae
(@malae)
Hello Beatrice<
I have always cleared the browser and the server caches. I am not using a cache plugin. I have just run all the previous checks again with the same results for version 3.3.7. Using version 3.3.5 everything displays correctly.
Note that I am using the Classic Editor for this website with captions set to be inside. On a different website using the Block Editor with the Elementor plugin and captions set to outside, I have no problems.
Hello @malae,
Could you please let me know which theme you’re using? Also, if possible, could you share a few screenshots showing the steps you take to add captions and images to your site?
Warmly,
Beatrice.
Thread Starter
Malae
(@malae)
Hello Beatrice,
As explained earlier, both sites with this problem use the Twenty Thirteen with child themes. These sites were built more that 12 years ago with relatively few changes and additions over the years. I didn’t use galleries and always used the Add Media button to add images to pages. I don’t recall exactly how the captions were added originally. There have been many changes in the page that opens when the Visual Editor is open for the page and the Edit icon is clicked on the image. For the captions to appear in the FancyBox display, they now only work if added to the Image Title Attribute box in Advanced Options.
This may not have been the case 12 years ago as there were many upsets when the block editor was introduced. I would have to do some experimenting with a set-up using the original WordPress and plugin versions and work up from there to know what has happened as the changes took place. Following the many changes made by WordPress updates (not by me), the images on the pages now typically show the captions on the Code page for the regular-sized image (not for the FancyBox like this one for the example I posted:
<img class="wp-image-5915 alignleft" style="border: 5px solid #927a57;" title="<a/><span style="color: #222222; font-size: small;"><strong>Glossy Ibis</strong></span><br /><span style="font-size: x-small;">Photograph attributed to André Karwath, Creative Commons Attribution-Share Alike 2.5 Generic License.</span>"
However, for the title attribute boxes needed for the FancyBox, I add:
<span style="color: #222222; font-size: small;"><strong>Glossy Ibis</strong></span><br /><span style="font-size: x-small;">Photograph attributed to André Karwath, Creative Commons Attribution-Share Alike 2.5 Generic License.</span>
The changed coding for the regular images is confusing and hard to read, but I haven’t found a way to revert it to the original coding on the page. Am I missing something?
Hello @malae,
Would you mind updating to a more up-to-date theme? Also, please ensure that you’re using the latest versions of both WordPress and PHP.
Warmly,
Beatrice.
Thread Starter
Malae
(@malae)
Hello Beatrice,
First I must apologise for some incorrect information: the theme in use is Twenty Eleven and not Twenty Thirteen. Perhaps you can check out the compatibility issues with this theme My WordPress is version 6.8.1 and PHP is version 8.3.19.
Thank you for your suggestion to use a later WordPress version. If I go to Twenty Nineteen with FancyBox version 3.3.7, it does not show the scrambled captions, although it would need a child theme and adding CSS to style the captions. With more than 140 images in various configurations changing the theme would not be possible at this time.
If you do not find a solution to this caption issue, may I ask what are the vulnerabilities in staying with FancyBox version 3.3.5?
