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
@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
@justinpheap.co I use one Home index page. Within that index I have one subpage for desktop view and one subpage for mobile that I show/hide with the code above.
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
12
6
5
3
Popular Days
Feb 19
7
Feb 6
5
Jul 27
5
Jul 28
4
Top Posters For This Question
christyprice 12 posts
eliasbalk 6 posts
rwp 5 posts
justinpheap.co 3 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
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
christyprice
@justinpheap.co I use one Home index page. Within that index I have one subpage for desktop view and one subpage for mobile that I show/hide with the code above.
Posted Images
42 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