Robert Neu

Did you try the “Large Image” option? If that links directly to the large image file, featherlight should pick it up.

Unfortunately, I’m not familiar enough with the plugin you’re talking about to answer this. I’m pretty sure Post Media Grid is an element within Visual Composer, but I’ve never actually used it myself.

The best answer I can give you is that if the default prettyPhoto lightbox has an option to be disabled within Visual Composer or whatever plugin you’re using, then yes, WP Featherlight should work correctly, assuming the links are just image files.

If you’re not able to figure it out, try reaching out to the author of the other plugin and ask if it’s possible to disable their lightbox and use another one.

Hope that helps!

Hey Terbium,

It sounds like your theme is calling a custom function from one of the plugins on the site. The function plugin_url is not part of WordPress core, so that’s why you’re seeing an error with your plugins deactivated.

You’ll need to either figure out where that function is coming from and re-activate that particular plugin, or make sure the function exists by using a function_exists check before using it in your theme.

Hi Terbium,

It looks like you have a JavaScript error on that page: TypeError: a.cookie is not a function which is coming from a script loaded by WooCommerce.

This gallery demo, which is running WordPress 4.4 and the latest version of WP Featherlight, should confirm that there are no conflicts with WordPress 4.4 and WP Featherlight.

I think there must be an issue with one of your other plugins or your theme. Try disabling WooCommerce and see if the issue is resolved. If not, I’d recommend disabling all other plugins on the site and then re-activating them one-by-one until you find the source of your JS error.

If that still doesn’t work, try switching to one of the WordPress default themes and see if the error persists.

Hey Hexagongirl,

marcandre has been the active maintainer of featherlight for as long as I’ve been using it and he’s always been pretty quick about getting issues patched and pull requests merged in, so I wouldn’t worry too much about that.

I’m going to be working on getting this fixed over the holidays, so hopefully we’ll either have a patch for featherlight or a workaround within our plugin right after the new year.

As for your current issue, I’ll need to do some testing with fluidvids, but FitVids seems to work as expected. Here’s a demo of the plugin working with a responsive video alongside FitVids.

I’ll look into getting it working with fluidvids and update this thread as soon as I have more information or when we push an update which solves this problem.

Hope that helps!

This is actually a bit of a bug in the featherlight script. By default, it handles videos and other iframes this way. It can be overridden with JS, but there’s an open issue on the featherlight repo about it and I’m hopeful it will be adjusted in the next release.

If it isn’t updated soon, we’ll make some adjusted in the version bundled in our plugin and have this patched in the next version regardless.

Sorry for the trouble!

Hmmm… That’s really strange. For some reason the jQuery file from WP Featherlight isn’t being loaded on that page at all. I see the CSS file in the head, but no JS in the footer.

Normally the only way that would happen is if it’s been removed in the theme or another plugin by either using one of our filters, unhooking the function that loads it, or by dequeueing the script handle.

I’d be happy to investigate a bit more if there’s a way for you to provide me access to your server. If you’re comfortable sending access, you can send it over to [email protected] using https://www.pastevault.com/

Without more access, I don’t think there’s anything else I can do on my end.

Hey xSann,

It looks like there’s a JS error being thrown on your site that’s preventing the execution of WP Featherlight.

The error is TypeError: jQuery.equalizer is not a function and it seems to be caused by a related posts function in your theme?

It looks like it’s caused by this code block just before your comments are output:

jQuery(document).ready(function( $ ){
   //jQuery('.yuzo_related_post').equalizer({ overflow : 'relatedthumb' });
   jQuery('.yuzo_related_post .yuzo_wraps').equalizer({ columns : '> div' });
});

I’m guessing that there’s a JS library that’s not being enqueued at all or not being enqueued early enough.

I hope that helps!

Awesome! Glad you were able to get it sorted out. ??

Hey Tim,

As far as I can tell, you’re not using our plugin. It looks like you have the featherlight script embedded in your theme which would be outside of what we’re typically able to support.

Your best bet for help with the featherlight script would be to use their tag on StackOverflow.

That said, it looks like the issue you’re having is because of duplicate/incorrect markup within the theme itself. Until the duplicate items are removed, they’re going to be pulled in as gallery items.

It is also possible to specify a content filter for the gallery so that it only target specific DOM elements, but I think you’d be better off removing them from the markup as they don’t seem to serve any purpose right now.

Here’s an example of what your markup currently looks like vs what it should look like for the gallery to work the way you’re expecting:

https://gist.github.com/robneu/a67dbf125a629ac205ab

I hope that helps!

Hey Tim,

Unless I’m misunderstanding, which is totally possible, I’m not seeing any duplication on the URL you posted. Were you able to get this resolved or are you still having issues?

If you are, can you post a screenshot of the exact problem you’re having so I can help you get it resolved?

Hey William,

Thanks! I definitely have done things like that using this plugin, but it requires some custom code. In theory I think it might be possible to do this using featherlight’s data attribute API rather than writing additional JS, but I haven’t tried doing it that way myself.

If you have any code that’s semi-working or an example of some markup that you’re trying to get working post it here and I’ll do my best to help you work your way through whatever issues you’re running into.

Hey Lars,

You should be able to override the default background color using something like this in your theme or child theme:

body .featherlight:last-of-type {
	background: #fff;
}

If that doesn’t get it, you may need to add !important to the background rule, but most of the time that should be enough without it.

We’ll add some common CSS changes to the plugin docs on the next update! ??

That’s a good point. I stopped using this after reading more about the issues with the sanitization method being used.

I did see that newer SVG sanitization library based on DomPurify and it does look promising. They also have a WordPress plugin, but it circumvents the WordPress filesystem so I dunno if I’d use that one either…

Sweet! I wasn’t aware of is_admin_bar_showing until now. I’ll have to remember that one.