Tagged: ,

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #587630

    Hey there,

    I have a two-sided platform with 1) a restricted area with 100+ pages where I DON’T want the lightbox to appear because I have NEXTGEN (the lightbox comes up behind NEXTGEN and 2) the non-restricted surrounding pages where I WANT the lightbox to appear (aint using nextgen here)

    Is there a smart way to go about this?

    I have read similar posts like this:
    https://kriesi.at/support/topic/ (Purchase code hidden if logged out) -certain-images-in-postspages/

    But the solution is excluding certain ones, which will be a very long piece of code, plus very inflexible as I’ll add a lot of new pages every week, and would have to edit the code each time.

    So, do you see any other solution that fit my setup :) ?

    Thank you!

    Best regards
    Emil

    #587651

    i suppose this was a topic i’m interested too in a former installation – look here – this was the solution Josue gave me:

    https://kriesi.at/support/topic/ (Purchase code hidden if logged out) -a-specific-page/

    #587656

    Hey!

    Please refer to @guenni007‘s post
    @guenni007 thanks as always :)

    Regards,
    Yigit

    #587728

    Hey,

    Thank you for contributing to the post.

    But, that solution still requires me to write every single instance of page ID into the code, and every time I add a new page. Or am I missing something? Is there no less manual way to go about it?

    #587737

    Hi!

    Please turn on custom CSS field for ALB elements – http://kriesi.at/documentation/enfold/ (Purchase code hidden if logged out) -for-all-alb-elements/ and give your elements a custom CSS class and then go to Enfold/js/avia.js and find

    exclude			:	'.noLightbox, .noLightbox a, .fakeLightbox, .lightbox-added, a[href*="dropbox.com"]',

    and change it to

    exclude			:	'.your-custom-class, .your-custom-class a, .noLightbox, .noLightbox a, .fakeLightbox, .lightbox-added, a[href*="dropbox.com"]',

    That should disable lightbox on your elements with that custom class.

    Cheers!
    Yigit

    #587770

    Sounds good!

    Though, Nextgen Gallery elements are shortcodes and not Enfold elements, so enabling the custom css field, won’t really affect them I assume?

    Then it would require me to know what “elements” of NextGen Gallery should be excluded and their class?

    Or perhaps – can you apply it to, say, a Color Section and it will affect every sub-element such as a NextGen shortcode?

    #587775

    Hey!

    You can apply custom CSS class to all elements including color section and column elements :)

    Cheers!
    Yigit

    #587789

    does he want pointer-events: none ?

    i thought he wants a normal link not a lightbox

    #587796

    Hi!

    He would like to disable Enfold’s lightbox on his pages where he uses Nextgen

    Cheers!
    Yigit

    #587804

    Applying a color section a custom class, does that affect the NextGen shortcode inside it? It’s not like I want to disable lightbox from the color section itself, only its children/content/elements

    #587815

    Hey!

    Applying a custom class to color section and then editing avia.js will disable Enfold’s lightbox from that color section and it’s content.
    Please try firstly.

    Cheers!
    Yigit

    #613302

    I’ve been looking for a solution to exclude the featured image from the lightbox (either across the whole site or on particular pages). However, I cannot disable it completely per page as other elements below featured image require it.

    I have done a fair amount of search and reading here in the forums and found what I thought would be the solution in editing avia.js as shown above and enqueueing in child theme. However, I noticed that the featured image link already has class .lightbox-added. Seems to me that section isn’t working as it should. Ideas?

    • This reply was modified 2 years, 9 months ago by  livengrin.
    #613335

    Hi!

    Have you referred to my post here – https://kriesi.at/support/topic/ (Purchase code hidden if logged out) -allow-for-certain/#post-587737

    If you are using a child theme, please add following code to Functions.php file of your child theme

    function wp_change_aviajs() {
       wp_dequeue_script( 'avia-default' );
       wp_enqueue_script( 'avia-default-child', get_stylesheet_directory_uri().'/js/avia.js', array('jquery'), 2, true );
    }
    add_action( 'wp_print_scripts', 'wp_change_aviajs', 100 );

    and move modified file inside /js folder

    Regards,
    Yigit

    #614209

    Thanks for your response. I have implemented the solution above. My understanding of the code was that everything with a class included in that ‘exclude:’ section of avia.js should not be lightboxed. If this is true, then why were elements such as the ‘.big-preview.single-big a’, which have a class of .lightbox-added, appearing in the lightbox. I ultimately solved the issue by using a page specific class coupled with that exact element and then removing the pointer events for same in css.

    Example:

    exclude: ‘.postid-9000 .big-preview.single-big a, .my-test-class, .noLightbox, .noLightbox a, .fakeLightbox, .lightbox-added, a[href*=”dropbox.com”]’,

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

The topic ‘Disable lightbox on many pages / allow for certain’ is closed to new replies.