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

    Hi guys,
    I am using the media element “gallery” on our website and I can´t find a way to limit the number of displayed thumbnails. I have multiple galleries, some with 10, some with 30 images. For all of them I want to limit the number of displayed thumbnails to a maximum of 5. If a user clicks on the image he should be able to view all images in the lightbox. Any idea how to do that?
    Thank you in advance!
    Daniel

    #748977

    I found this in a similar post, which unfortunately does not work for me:

    #top #wrap_all .avia-gallery .avia-gallery-thumb a:nth-last-child(-n+3) {
    display: none !important;
    }

    Unfortunately it only helps, if all of the galleries have the same amount of images, which is not the case. Or do I just not understand the nht-last-child correctly? Any other ideas?

    #750413

    Hi,

    Can you post links to the pages mentioned? also can you provide temporary admin account so we can check the backend for the said pages. Please place the login details in Private Content when you reply.

    Best regards,
    Nikko

    #750474

    Hi Nikko,
    attached I send you a link to one of the pages. If you scroll down you see multiple image thumbnail displayed. I want to limit the number of thumbnails, but have the other images available to be displayed in the lightbox.
    I appreciate if there is a custom CCS solution.
    Thx
    Daniel

    #752574

    Hi,

    Try adding this css code in QUick CSS (located in Enfold > General Styling):

    .single-portfolio .avia-gallery-thumb > a {
        display: none !important;
    }
    
    .single-portfolio .avia-gallery-thumb > a:first-child, 
    .single-portfolio .avia-gallery-thumb > a:nth-child(2), 
    .single-portfolio .avia-gallery-thumb > a:nth-child(3), 
    .single-portfolio .avia-gallery-thumb > a:nth-child(4), 
    .single-portfolio .avia-gallery-thumb > a:nth-child(5), 
    .single-portfolio .avia-gallery-thumb > a:nth-child(6) {
        display: block !important;
    }

    I’ve made it to show 6 (though you said 5) since it looks better but you can remove the .single-portfolio .avia-gallery-thumb > a:nth-child(6) and the comma (,) before it to make it only 5. Hope this helps.

    Best regards,
    Nikko

    #752905

    Hi Nikko,
    thanks but unfortunately it doesn´t change anything in the gallery thumbnails. Still in all gallerie smore than 6 thumbnails.

    #755912

    Hi,

    Sorry for the late response but can you give a link to the page that still has the issue and also a temporary admin account, so we can check the backend, and know why it’s not working.

    Best regards,
    Nikko

    #756278

    Hi Nikko,
    I removed the section for the gallery in the quick CSS again. Attached you find the temporary admin access. Thanks again for your support on this topic.
    Daniel

    #756955

    Hey guys, already new findings on the topic?
    Regards
    Daniel

    #758383

    Hello?? Still there?

    #759840

    Hi Daniel,

    I apologize for missing your thread, I have added the css code in Quick CSS in Enfold Child > General Styling, then I cleared the cache from autoptimize plugin and it worked well.

    Best regards,
    Nikko

    #759874

    Hi Nikko,
    no worries as long as it is working :)
    Thank you very much, looks really good.
    Cheers
    Daniel

Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.