It's almost there... but i cant work one thing out. How to change one of my banner hero images for mobile. It looks great on desktop however its too small on mobile, so i have another logo ready thats zoomed right in that i'd like to use for mobile only. I've added the file in design > custom css > manage custom files so i can use the link to the file
I'm fairly familiar with media queries but i don't know the code to change the banner. When I inspect I get this code:
ETA: If you are on the newer Squarespace 7.1, this post has a walkthrough: How to Show a Different Banner Image on Mobile in Squarespace
Hi @Joeyearthly,
If you are using an index pag
Oh my goodness, amazing! I couldn't work out where to add a margin or some padding but you've solved it for me. Thank you so much, you've solved a real headache!
@christyprice This sounds like an elegant solution. Do you have any troubleshooting advice? The code doesn't seem to affect my index sections, both remain visible. My site is igcalgary.com but I curre
Question
Joeyearthly 1
Hello! So my site is https://earthlycraft.co/
It's almost there... but i cant work one thing out. How to change one of my banner hero images for mobile. It looks great on desktop however its too small on mobile, so i have another logo ready thats zoomed right in that i'd like to use for mobile only. I've added the file in design > custom css > manage custom files so i can use the link to the file
I'm fairly familiar with media queries but i don't know the code to change the banner. When I inspect I get this code:
.sqs-block-image .image-block-outer-wrapper:not(.image-block-v2) .intrinsic .image-block-wrapper img
Therefore i'm going for something along the lines of:
@media only screen and (max-width: 600px) {.sqs-block-image .image-block-outer-wrapper:not(.image-block-v2) .intrinsic .image-block-wrapper img {background image: https://static1.squarespace.com/static/5d00032088447c0001487495/t/5dcdc90c40062f0cf29e9ddc/1573767446853/mobilelogo.png;}}
Help would be much appreciated!!
Cheers!!
Link to post
Top Posters For This Question
13
6
6
5
Popular Days
Feb 19
7
Feb 6
5
Jul 27
5
Jul 28
4
Top Posters For This Question
christyprice 13 posts
tuanphan 6 posts
eliasbalk 6 posts
rwp 5 posts
Popular Days
Feb 19 2020
7 posts
Feb 6 2020
5 posts
Jul 27 2020
5 posts
Jul 28 2020
4 posts
Popular Posts
christyprice
ETA: If you are on the newer Squarespace 7.1, this post has a walkthrough: How to Show a Different Banner Image on Mobile in Squarespace Hi @Joeyearthly, If you are using an index pag
LucyDesigns
Oh my goodness, amazing! I couldn't work out where to add a margin or some padding but you've solved it for me. Thank you so much, you've solved a real headache!
GMDI
@christyprice This sounds like an elegant solution. Do you have any troubleshooting advice? The code doesn't seem to affect my index sections, both remain visible. My site is igcalgary.com but I curre
Posted Images
51 answers to this question
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment