Tagged: ,

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • February 23, 2016 at 11:52 am #587630
    Emilvillumsen

    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/disable-image-lightbox-only-for-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

    February 23, 2016 at 12:30 pm #587651
    Guenni007

    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/disable-integrated-lightbox-effect-for-a-specific-page/

    February 23, 2016 at 12:36 pm #587656
    Yigit

    Hey!

    Please refer to @guenni007’s post

    @guenni007     thanks as always :)

    Regards,
    Yigit

    February 23, 2016 at 2:40 pm #587728
    Emilvillumsen

    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?

    February 23, 2016 at 3:15 pm #587737
    Yigit

    Hi!

    Please turn on custom CSS field for ALB elements – http://kriesi.at/documentation/enfold/turn-on-custom-css-field-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

    February 23, 2016 at 4:11 pm #587770
    Emilvillumsen

    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?

    February 23, 2016 at 4:21 pm #587775
    Yigit

    Hey!

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

    Cheers!
    Yigit

    February 23, 2016 at 4:52 pm #587789
    Guenni007

    does he want pointer-events: none ?

    i thought he wants a normal link not a lightbox

    February 23, 2016 at 4:56 pm #587796
    Yigit

    Hi!

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

    Cheers!
    Yigit

    February 23, 2016 at 5:09 pm #587804
    Emilvillumsen

    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

    February 23, 2016 at 5:21 pm #587815
    Yigit

    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

    April 13, 2016 at 11:46 pm #613302
    livengrin

    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 8 years, 7 months ago by livengrin.
    April 14, 2016 at 1:01 am #613335
    Yigit

    Hi!

    Have you referred to my post here – https://kriesi.at/support/topic/disable-lightbox-on-many-pages-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

    April 14, 2016 at 7:26 pm #614209
    livengrin

    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”]’,

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Disable lightbox on many pages / allow for certain’ is closed to new replies.