How To Change The Size Of A Squarespace Gallery Section On Mobile // Gallery Section Size on Mobile

More and more people are accessing the internet from their mobile devices, so it's important that your Squarespace website looks great on all screen sizes. By default, Squarespace galleries may not display perfectly on smaller screens, but don't worry; I've got you covered.

In this tutorial, you’ll learn how to modify your gallery section size for mobile devices using CSS. The codes are below the video, but there are a few parts you might want to change so be sure to watch the step-by-step tutorial first.

/* - - Gallery Reel - - */
@media only screen and (max-width:767px) {
.gallery-reel{
height:50vh!important
}
.gallery-reel-item{
height: inherit!important
}
}

/* - - Fullscreen - - */
@media only screen and (max-width:767px) {
.gallery-fullscreen-slideshow{
height: 30vh!important
}
}

/* - - Simple Slideshow - - */
@media only screen and (max-width:767px) {
.gallery-slideshow-item-wrapper, .gallery-slideshow-item img{
width: 100vw!important;
object-fit: cover;
left: 0!important
}
}

/* - - Show Thumbnails - - */
@media only screen and (max-width:767px) {
.gallery-slideshow-thumbnails {
display: inline!important
}
}
- -
❤️ Like this tutorial? Buy me a coffee to say thanks! ☕ https://buymeacoffee.com/insidethesquare
⭐ NEW: List of my top 7 FREE Squarespace tutorials: https://insidethesquare.co/top7
📑 Download my collection of CSS codes for Squarespace at https://insidethesquare.co/css
🙋 Need some help? Visit ​https://insidethesquare.co/code-help​ to see my current support options.
- -
💻 WEBSITE → https://insidethesquare.co
📧 NEWSLETTER → https://insidethesquare.co/email
🤳 INSTAGRAM →   / thinkinsidethesquare  
👍 FACEBOOK →   / insidethesquare  
📌 PINTEREST →   / insidethesquare  
- -
💸 GET 10% OFF YOUR FIRST YEAR OF SQUARESPACE 💸 Use my affiliate link and code INSIDE10 - You'll save 10% off your first annual subscription & Squarespace will give me a little commission for sending you their way 😎 🔗 INSIDE10 → https://insidethesquare.co/inside10
- -
The term "Squarespace" is a trademark of Squarespace, Inc. This video was not approved or endorsed by Squarespace, Inc. I just really love their platform ♥