Tagged: gallery
-
AuthorPosts
-
February 9, 2021 at 12:24 pm #1279027
Hi
I use a on pages Gallery, big picture with thumbnails below, Gallery (845×684), and same size for all thumbnails (Portfolio 495×400).But even when all pictures have the same size, there are caps/spaces between the thumbnails. Got this problem on different Pages.
What is here the problem? See for example Link in private content.
Thanks
RenéFebruary 9, 2021 at 2:24 pm #1279069Hi baiker,
Some of the thumbnails are slightly larger than the others which causes the issue.
To fix it, try adding this CSS code in Enfold > General Styling > Quick CSS:#top #wrap_all .avia-gallery-thumb a { height: 82px; }
Hope it helps.
Best regards,
NikkoFebruary 9, 2021 at 2:33 pm #1279076Hey Nicco
That works for Desktop View. On Mobile view, there is now some space between the thumbnail rows. I could live with it, but if there’s a solution…
René
- This reply was modified 3 years, 9 months ago by baiker.
February 9, 2021 at 7:55 pm #1279216Hi René,
Please try this code with the media query:
@media only screen and (min-width: 1024px) { #top #wrap_all .avia-gallery-thumb a { height: 82px; } }
If you need further assistance please let us know.
Best regards,
VictoriaFebruary 10, 2021 at 10:53 am #1279359Hi Victoria
Unfortunately, that doesn’t solve the problem.
René
February 11, 2021 at 9:10 am #1279684Hi,
Did you need additional help with this topic or shall we close?
Best regards,
Jordan ShannonFebruary 11, 2021 at 7:01 pm #1279836You can close. Thanks.
February 12, 2021 at 11:35 am #1279958Hi baiker,
Can you try adding this code at the bottom of functions.php:
function mygallery_thumbnails(){ ?> <script> (function() { const thumbnails = document.querySelectorAll('.avia-gallery-thumb a'); thumbnails.forEach(el => { const width = parseFloat(el.getBoundingClientRect().width) * 0.84; el.style.height = width + 'px'; }); })(); </script> <?php } add_action('wp_footer', 'mygallery_thumbnails');
The code will basically get the width of the thumbnails and adjust the height with respect to the width of the thumbnails to remove those extra spaces below.
Let us know if this helps.Best regards,
NikkoFebruary 12, 2021 at 4:13 pm #1280087Hi Nikko
Didn’t work. But thanks for trying to help, iit seems, I have to live with it. You may close the thread.
René
February 12, 2021 at 4:23 pm #1280090Hi René,
We apologize for the inconvenience we’ll be closing this thread then.
Thanks for using Enfold and have a great day!Best regards,
Nikko -
AuthorPosts
- The topic ‘Gallery Thumbnails with caps’ is closed to new replies.