Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

How to make Gallery Grid 2 Columns on Mobile [Paloma Template]


maxdobbs

Question

Hi all,

I'm using the Paloma template for my website gohoopday.com. If you scroll down to the sixth fold, you'll see tons of logos. On mobile, these stack (1 per row), which isn't very mobile-friendly. I am trying to get 2 or 3 per row for mobile.

On a previous site with a different template, I used a formula similar to the ones listed in the link below, but on this template it's not registering.

I've tinkered around and tried this, but it only pushes the logos to the left rather than creating 2 columns.

@media only screen and (max-width: 640px) {
.gallery-grid-item { 
   width: 50% !important;
  }
}

I am wondering if it is because this is a gallery page vs an image gallery.

Anyways, I cannot figure it out - please let me know if you can help!

Max

Link to post
  • Answers 32
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Hey Folks!  In 7.1 galleries are set up differently than they used to be in 7. Long story short, it is no longer a width % or px issue, it's actually a setting that says how many are being displayed

Posted Images

Recommended Posts

  • 0
On 6/16/2020 at 5:59 PM, RyanDejaegher said:

@JasonGipson

/* Add this code to Design -> Custom CSS */
 



@media(max-width:767px) {
.gallery-strips-item {
    width: 100% !important;
    position: unset !important;
    transform: unset !important; 
}

.gallery-strips-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 20px;
    height: unset !important;
}

}

Result:

image.thumb.png.bb41022e72dc3ada673b90b46b2e25ad.png

I've added this code but the only issue is that it fixes the images size by width rather than height so there's a blank space when it's a landscape and portrait image side by side. 

The gallery in question is www.gabrielasilveira.squarespace.com/commissioned and the password is hello

 

Thank you for all your help! 

 

Screenshot 2020-06-21 at 14.38.43.png

Link to post
  • 0
On 12/1/2020 at 2:27 AM, ando_337 said:

Hi,

with the codes above I couldn't figure out how to change the gallery block items to 3 per row (+ adjusting the size/padding) for mobile. 
(I also used text beside gallery for desktop view, but that shouldn't make a difference, am I right?)

This is the URL to my site:  
https://www.inneco.de/eco-premium-eco-basic

Hope you can help me with this issue!
Thanks a lot!

Bildschirmfoto 2020-11-30 um 20.27.11.png

Add to Home > Design > Custom CSS

@media screen and (max-width:767px) {
.gallery-grid-wrapper {
    grid-template-columns: repeat(3,1fr) !important;
}
}

 

You can send your question to my email to get detail answer. / How to Setup Password & Share URL

--- Happy New Year

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...