Control EFBP To NOT Trigger On Mobile Viewport Sizes

[Joe Streno]

I’m using EFBP to show WikiWand (and other) pages via text links in am iframe FancyBox. This works & looks good on desktop and tablet screens, but is far too narrow for smartphone screen sizes.

Is there a way for EFBP to determine the viewport size and not load a FancyBox, but open the text link page in a new browser tab on smartphones? Can it be done in CSS, or as a WP function?

This is a huge one for me. I really don’t want to go back through every post in my blog and remove the fancybox-iframe class from those type of links.

Also I’m not sure I understand the “Allow embedded content to jump to full screen mode” in the prefs. I was assuming that there would be some sort of button on the FancyBox to allow for full screen on those ill-behaving smartphone FancyBoxes … but I don’t see any method to make this full screen. Just an X close box.

Am I missing something, or is that not what “Allow embedded content to jump to full screen mode” does.

Thanks!

[RavanH]

Hi Joe,

Yes, there is an option for this. In the Miscellaneous section, under Browser & device compatibility, you can find the option Minimum browser/device viewport width. Give this a value like 420 to disable FancyBox on smaller devices in portrait mode. Note that when rotating the device to landscape, the screen width will change and the light box might work again, depending on the minimum width you have set.

The option Allow embedded content to jump to full screen mode is for videos (or other iframed media) that have a “view in full screen” button…

Let me know if you need more help 🙂

[Author]

Posts