Tagged: ,

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • November 2, 2022 at 6:03 pm #1371122
    envato99

    Hi,

    When users click on the images in the MASONRY GALLERY, a pop-up / LIGHTBOX (?) opens with a larger version of the same image. [See URL in Private Content below.]

    Is it possible to make the pop-up window larger? RIght now it’s pretty small.

    Thanks,
    Stephen.

    November 3, 2022 at 2:04 am #1371160
    Ismael

    Hey Stephen,

    Thank you for the inquiry.

    You can use this css code to adjust the size of the lightbox container.

    .mfp-zoom-in.mfp-image-loaded .mfp-figure, .mfp-zoom-in.mfp-ready .mfp-iframe-holder .mfp-iframe-scaler {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

    Please toggle or temporarily disable the Enfold > Performance > File Compression settings after adding the css to regenerate the stylesheets.

    Best regards,
    Ismael

    November 23, 2022 at 5:36 pm #1373659
    envato99

    Thanks Ismael.

    Sorry for the delay in getting back to you.

    I’m looking at this issue again — I tried the CSS code above but could not see a difference.

    What I am trying to do is to have the Lightbox occupy, say, 80% of the screen — is that possible?

    I was also hoping to have the image the Lightbox loads be at the original uploaded size, not a WordPress resized version.

    Link below is just to view a test page for this issue.

    Thanks again,

    Stephen.

    November 24, 2022 at 9:27 am #1373713
    Ismael

    Hi,

    Thank you for the update.

    You may need to toggle or temporarily disable the Enfold > Performance > File Compression settings after adding the css modification. Please make sure to purge the cache afterwards and hard refresh the page.

    This is how the lightbox looks after applying the modification directly in the browser.

    Screenshot: https://1drv.ms/u/s!AjjTfXSRbKTvzGPQmHQr8HnZ7kFs?e=MOhdPI

    Best regards,
    Ismael

    November 24, 2022 at 11:58 am #1373723
    Guenni007

    what is it as source – an image or something else?
    if it is an image try:

    #top .mfp-image-holder .mfp-content {
  max-width: 90vw;
}

    for image lightbox put this to your child-theme functions.php:

    function change_lightbox_size() {
    return "full";
}
add_filter('avf_avia_builder_helper_lightbox_size','change_lightbox_size', 10);

    for the rest you can test:

    /**  Masonry Gallery ??? ********************************/
function avia_change_masonry_thumbnail_link($size){
  return "full";
}
add_filter('avf_avia_builder_masonry_lightbox_img_size', 'avia_change_masonry_thumbnail_link', 10, 1);
/*** End ***/

/** Image Gallery **/
function avia_change_gallery_thumbnail_link($link, $attachment, $atts, $meta){
    $link = wp_get_attachment_image_src($attachment->ID, "full");
    return $link;
}
add_filter('avf_avia_builder_gallery_image_link', 'avia_change_gallery_thumbnail_link', 10, 4);
/*** End ***/

/** Source for the Ajax Gallery **/
add_filter("avf_ajax_preview_image_size", function($size) {
   $size = "full";
   return $size;
}, 10, 1);
/*** End ***/

    btw: do not use the option : Enfold (Child) – Performance : “Responsive Images For Lightbox (currently in beta only)”
    i think there is a little bug – i will open a topic for it now.

    November 24, 2022 at 1:30 pm #1373744
    envato99

    Ismael — thanks again. I have it working now.

    ====

    Thanks Guenni.

    This snippet seems to work:

    #top .mfp-image-holder .mfp-content {
    max-width: 90vw;
    }

    (The source is an image.)

    I also increased the LARGE SIZE / image size in WordPress > Settings > Media settings. Before, the default was 1030 x 1030, so that there now exists a larger image to load into the Lightbox.

    Thanks again both,

    Stephen.

    November 24, 2022 at 1:41 pm #1373747
    Mike

    Hi,
    Glad Guenni007 could help, thank you Guenni007, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Possible to make lightbox dimensions larger?’ is closed to new replies.