Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #994688

    Hello,

    I have an issue with my website. The images displayed through the gallery are smaller in the lightbox than in the preview: http://prntscr.com/kg0n9i

    I went through the forum and I found someone who had a similar issue here :

    The support team suggested him to include this code in functions.php but it did not work for me :

    // lightbox fullsize
    function lightbox_fullsize(){
    ?>
    <script>
        jQuery(document).ready(function() {         
            jQuery('.avia-gallery-thumb').on('click',' a',function(){
                jQuery(document).find('.mfp-wrap figure img').css("max-height","");
            });  
            jQuery(document).on('click','.mfp-arrow',function(){
                setTimeout( function(){
                        jQuery(document).find('.mfp-wrap figure img').css("max-height","");                                   
                    }, 180); 
            });
        });
    
    </script>
    <?php
    }
    add_action('wp_head', 'lightbox_fullsize');

    Can you help ? Thank you!

    #995405

    Hey 805ITS,

    Thank you for using Enfold.

    The images (see private field) are actually the same but they’re being resized with css. You can add this in the Quick CSS field to adjust the width of the lightbox image.

    img.mfp-img {
        width: 85vw;
    }

    If the image becomes a little blurry, you need to adjust the size of the “Large” thumbnail in the Settings > Media panel and then regenerate the images.

    Best regards,
    Ismael

    #995800

    Thank you! It worked!! :)

    #995826

    Hi,

    Great, glad you got it working :-)

    Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

    #1179979

    Rikard,

    I was having the same issue and using this code almost works. The problem is that it doesn’t take into consideration the portrait oriented images. Its fine for landscape orientation, but not portrait. This is in Lightbox mode only.

    And example of the issue can be seen here: https://michaelalbany.com/Kriesi-test/

    Is there additional CSS to accommodate?

    More infö in Private Content

    Thank you!
    Michael

    • This reply was modified 1 year, 4 months ago by  MichaelAlbany.
    #1180261

    Hi,

    @michaelalbany: The modification is not going to work well for portrait modes because the lightbox script automatically sets the maximum height of the images. You have to set the width to auto.

    We can override the default maximum height property, but the image will overflow outside the main container.

    img.mfp-img {
    	width: 85vw;
    	max-height: none !important;
    }

    Best regards,
    Ismael

    #1180295

    This is a major problem then. Most of my clients are photographers and they will have both Portrait and Landscape oriented images, myself included.

    Small images of 1031 on a 27″ monitor (what most editors use) just won’t market artists properly. I tried your above code, not helping.

    Any other suggestions? The gallery options included in enfold is a very large part of its attraction.

    #1180445

    Let me ask this, Is there a way to change the container size and what will that impact in a negative way?

    Thanks!

    PS – Or is there a better option such as a slider with thumbnails?

    • This reply was modified 1 year, 4 months ago by  MichaelAlbany.
    #1180791

    Hi,

    The default size in the lightbox without adding the modification above seems to be quite enough to exhibit the quality of the images (see link below).

    // https://imgur.com/a/xVkZKrn

    Please note that the css code above will not actually enlarge the image — it will only stretch it, but the actual dimension of the image will stay the same. If you want to change the default size of the lightbox thumbnail, go to the Settings > Media panel and adjust the dimension of the Large thumbnail. You’ll have to regenerate the images afterwards (https://wordpress.org/plugins/regenerate-thumbnails/), or upload them again.

    Best regards,
    Ismael

    #1181122

    Regenerating the thumbnails AND the php code to change the optimizing of images fixed the issues.

    Thank you!

    #1181478

    Hi MichaelAlbany,

    Glad we could help :)

    If you need further assistance please let us know.
    Best regards,
    Victoria

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

You must be logged in to reply to this topic.