Tiled images in Mobile view

Could you explain in more detail what you mean when you say the gallery looks “too small” on mobile?

I don’t think you can easily display a Jetpack tiled gallery at one screen size and a non-tiled gallery at another size, but you could definitely ask Jetpack support to see if that’s possible somehow.

https://jetpack.me/contact-support/

The only quick workaround I can really think of is to insert two galleries (one regular thumbnail and one tiled) and hide each one using display: none using media queries at the screen sizes you want. It’s a bit hacky but could work. ??

https://en.support.wordpress.com/custom-design/custom-css-media-queries/
https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
https://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries

Thanks Kathryn,

Sorry been quite busy with life in general so have just had the chance to test out what you advised. This worked really well for some of the other stuff I was looking to remove from mobile view such as the Featured Content from the sketch theme. But I’m struggling to find the class that references the tiled gallery. Not sure which class to use and therefore haven’t been able to set the gallery to ‘thumbnail’ if accessed on a mobile.

Hoping you can help.

Thanks!!!

Hi Jay, do you still have any tiled galleries on your site? I went to the Wildlife and Street pages but only see standard galleries there.

Regardless, tiled galleries are in a div with the class:

.tiled-gallery

Let me know if this helps!

Thanks Kathryn, Yeah I removed the tiles gallery because I couldn’t make the ‘if’ condition work.

Gotcha. I’ve marked this thread as resolved, but if you ever decide to give this another go feel free to start a new thread and we can have another look.