Docs

[Chgrim]

Hi,

I have this page https://www.topdownreviews.com/nectar-mattress-review/ with a gallery of images halfway down the page. Couple of questions.

1. Is there a way I can play with the spacing so I can do more than 4 across and have less padding between the thumbnails.

2. When I scale down the page it only has 1 column of thumbnails on mobile. Is there a way I can have 2 or 3 columns when on mobile?

3. I am using a light box so when you click on the images you can scroll through them. The only catch is that it isn’t very clear that you can scroll left or right. Is there a way to add arrows left or right when in the lightbox?

Thanks so much!
Chris

[Christopher]

Hi there,

#1,2 Please add following code in Customize -> Custom -> Global CSS :

.gallery .gallery-item {
    float: left;
    margin: 4% 1% 0 0;
}
.gallery-columns-4 .gallery-item:nth-child(4n) {
    margin-right: 1%;
}
.gallery-columns-4 .gallery-item {
    width: 19%;
}

@media (max-width: 767px){
.gallery-columns-0 .gallery-item, .gallery-columns-1 .gallery-item, .gallery-columns-2 .gallery-item, .gallery-columns-3 .gallery-item, .gallery-columns-4 .gallery-item {
    width: 47%;
    float: left;
    margin-right: 4%;
}
}

#3 Regretfully this isn’t a feature offered by X. It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities.

Hope that helps.

[Chgrim]

That worked!

I will look into getting a custom programmer for the lightbox.

Thanks so much.

[Joao]

Let us know if you need further assistance.

Cheers

[Author]

Posts