Fancybox Link Not Working

Hello there,

Thank you for explaining!
It might be an issue caused by a plugin or your theme.
I recommend installing this plugin: https://www.ads-software.com/plugins/health-check/

After you install and activate the above plugin it has a Troubleshooting mode which 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 troubleshoot mode and only activate Fancybox for WordPress and see if it works correctly with a default WordPress theme (Twenty Nineteen for example) and no other plugins.

Please let me know how it goes and what you find!

All the best,
Beatrice.

Hi Beatrice,

I tried installing the Health Check plugin, but when I put it in troubleshooting mode I can’t click on the button to check the Fancybox at all – the page appears in all shortcodes.

If I activate the WP Bakery Page Builder plugin used to to build the page, I can click on the button link but the Fancybox is still not working.

I migrated this site from another staging domain – https://shopwell.theglobalcreator.com – and the Fancybox link is working fine there. It was only after the migration that I had these issues on the new/live site.

Are there any next steps to troubleshoot the issue?

Thank you!
Amy

Hi Amy,

Can you please add this code in Appearance > Customize > Additional CSS:

.fancybox-video, .fancybox-iframe {
    height: 300px;
}

You can add a bigger value if you’d like to.

Warmly,
Mihaela

Hi Mihaela,

That worked for making the Typeform link appear, thanks!

Now, however, it appears at the bottom of the screen instead of in the center – is there something I can add to that code so the pop-up is centered in the screen?

Thank you!
Amy

Hi Amy,

Please send us a screenshot and also please tell us what device and what browser you are using.

Warmly,
Beatrice.

Hi Beatrice,

I am using a MacBook Pro and have tried both Safari and Chrome, and both have the same issue.

Here is a link to a screenshot: https://www.blueeracapital.com/wp-content/uploads/2021/06/Screen-Shot-2021-06-03-at-10.02.52-AM.png

Thank you,
Amy

Hello Amy,

Thank you for the screenshot!

We just tried on a few different devices (MacOS and Windows) and it seems to look ok on our end. I attached 2 screenshots one from Chrome and one from Safari. Is it possible to please try checking in incognito mode and see if the same happens? Thank you so much!

https://imgur.com/TO1O4Rl
https://imgur.com/sztD8H7

All the best,
Beatrice.

Hi Beatrice,

I tried incognito mode, and am still having the same issue. It is also happening on the mobile version as well (iOS).

Incognito on Chrome: https://www.blueeracapital.com/wp-content/uploads/2021/06/Screen-Shot-2021-06-07-at-10.29.51-AM.png

Mobile: https://www.blueeracapital.com/wp-content/uploads/2021/06/IMG_3973.png

Thanks!
Amy

Hello Amy,

Please add this code in Appearance > Customize > Additional CSS:

.fancybox-iframe {
    position: relative;
}

Warmly,
Beatrice.

Hi Beatrice,

That worked great, thanks so much for your help!!

Amy

Hi Amy,

I’m glad that everything works fine!

All the best,
Beatrice.