Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #202483

    Hello. I’d like to disable the lightbox effect that happens when a user clicks on a link to YouTube or any other video site. I’d like the link to instead take the user to the linked URL (ie., behave the default way). I would however like linked images to continue using the lightbox effect. How do I accomplish this? Thanks!

    #202822

    Hey DKwan!

    You can add a “noLightbox” class to the vimeo/youtube links. I.e.:

    
    <a href="http://www.youtube.com/watch?v=CfihYWRWRTQ">My Video</a>
    

    needs to be replaced with

    
    <a href="http://www.youtube.com/watch?v=CfihYWRWRTQ" class="noLightbox">My Video</a>
    

    Regards,
    Peter

    #203169

    Thanks Dude. Is there another way, one that doesn’t require adding a class? I’d like this feature disabled entirely.

    #203188

    Hey!

    Please edit js > avia.js and find this code on line 82:

    //activates the prettyphoto lightbox
    	if(jQuery.fn.avia_activate_lightbox)
    	jQuery(container).avia_activate_lightbox();

    Replace it with:

    //activates the prettyphoto lightbox
    	//if(jQuery.fn.avia_activate_lightbox)
    	//jQuery(container).avia_activate_lightbox();

    This should disable the lightbox plugin. Remove browser cache then reload the page a few times.

    Best regards,
    Ismael

    #203223

    Thank you. Is it possible to disable this only for videos? I’d actually like images to use the lightbox effect, just not the videos.

    The reasons is that I have a video page (here) that links to different video sources, most of which are not popular video sites like youtube or vimeo. I don’t want the lightbox effect to appear only for popular video sites and not the other sites, creating an inconsistent experience.

    #203502

    Hi!

    Edit js > avia.js, find this code on line 879:

    autolinkElements: 'a[rel^="prettyPhoto"], a[rel^="lightbox"], a[href$=jpg], a[href$=png], a[href$=gif], a[href$=jpeg], a[href$=".mov"] , a[href$=".swf"] , a[href*="vimeo.com"] , a[href*="youtube.com/watch"] , a[href*="screenr.com"]'

    Replace it with:

    autolinkElements: 'a[rel^="prettyPhoto"], a[rel^="lightbox"], a[href$=jpg], a[href$=png], a[href$=gif], a[href$=jpeg]'

    Remove browser cache then reload the page a few times.

    Cheers!
    Ismael

    #1085920

    Hi this function is now located in enfold/js/avia-snippet-lightbox.js

    My client specifically wants to disable video lightbox function on certain videos. So youtube videos open in new window and play directly at youtube.com

    I have a placeholder image that has a manual URL link to a youtube video.

    Set to open in a new window – page source shows target=”_blank”

    I have added class “noLightbox” to the Image – visible in page source – this removes the classes: “lightbox-added” and “mfp-iframe”

    I have (temporarily) // commented out avia-snippet-lightbox.js LINES 131,132

    	$.fn.avia_activate_lightbox = function(variables)
    	{
    		
    		var defaults = {
    			groups			:	['.avia-slideshow', '.avia-gallery', '.av-horizontal-gallery', '.av-instagram-pics', '.portfolio-preview-image', '.portfolio-preview-content', '.isotope', '.post-entry', '.sidebar', '#main', '.main_menu', '.woocommerce-product-gallery'], 
    			// autolinkElements:   'a.lightbox, a[rel^="prettyPhoto"], a[rel^="lightbox"], a[href$=jpg], a[href$=png], a[href$=gif], a[href$=jpeg], a[href*=".jpg?"], a[href*=".png?"], a[href*=".gif?"], a[href*=".jpeg?"], a[href$=".mov"] , a[href$=".swf"] , a:regex(href, .vimeo\.com/[0-9]) , a[href*="youtube.com/watch"] , a[href*="screenr.com"], a[href*="iframe=true"]',
    			// videoElements	: 	'a[href$=".mov"] , a[href$=".swf"] , a:regex(href, .vimeo\.com/[0-9]) , a[href*="youtube.com/watch"] , a[href*="screenr.com"], a[href*="iframe=true"]',
    			exclude			:	'.noLightbox, .noLightbox a, .fakeLightbox, .lightbox-added, a[href*="dropbox.com"]',
    		},

    I have (temporarily) // commented out

    //activates the prettyphoto lightbox
            //if($.fn.avia_activate_lightbox){
            //	$(container).avia_activate_lightbox();
            //}

    Cleared cache and opened incognito opened in a different browser.

    Lightbox functionality presists.
    I thought of writing a jQuery function to remove functionality, However, I have removed all JS functions that I could find that activate lightbox functionality. And there is no “rel^=”lightbox” on the object.

    How do I disable lightbox on specific objects (images, youtube video links) with a custom class?

    Your feedback and direction would be greatly appreciated

    h t t p s : / / kriesi.at/support/topic/ (Purchase code hidden if logged out) -links/
    h t t p s : / / kriesi.at/support/topic/ (Purchase code hidden if logged out) /

    #1087108

    Hi,

    You should add “noLightbox” class attribute to the link tag, not the image. Or use the alternate url format of youtube videos.

    Example:

    http://youtu.be/watch?v=G0k3kHtyoq
    

    Best regards,
    Ismael

    #1087128

    Hi Ismael,

    I have added class “noLightbox” to the ALB image dialogue box > Link Settings. However, Kreis’s code does not add the custom CSS class to the <a href link. it adds the class to the “avia-image-container”

    If you add custom CSS class to the “Link Settings” the same class is mirrored to the “Image Settings” Custom CSS Class

    This may not be the expected functionality, hence an update would be required in the next release.

    You can inspect page source – response private

    I tried your suggested alternate youtube video URL with https:// and https:// This opened a new window, However, I get a Video unavailable message from Youtube.

    It works if your remove www. and watch?v= from the youtube video URL. So you end up with ….
    https://youtu.be/BgcT_fX4vwU

    #1088094

    Hi,

    Does it work when you remove the “watch” parameter? You can also shorten the youtube url with bit.ly, so it won’t get recognized by the lightbox script.

    // https://bitly.com

    Best regards,
    Ismael

    #1088098

    Hi Ismael,

    Yes it works without the watch?v=

    If you could also fix this by rectifying the custom link CSS ‘noLightbox’class added to the < a href

    thanks!

    #1088480

    Hi,

    The class attribute is actually added where it’s supposed to, which is the parent container of the element, so there’s nothing to fix there. You can still add class attribute in the link tag using a custom script or by editing the shortcode file directly.

    Best regards,
    Ismael

Viewing 12 posts - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.