Jump to content

Swap portfolio banner image on mobile

Recommended Posts

  • Replies 2
  • Views 300
  • Created
  • Last Reply

Top Posters In This Topic

  • 3 weeks later...

Hello Tuanphan,

I found a solution that involved making two sections - one with a desktop image, and one with a mobile image - the code below instructs which section to display, based on browser width.

/* RTP remove bottom banner in desktop */
@media screen and (min-width:768px) {
[data-section-id="61e3062937970d62de6463e2"]{display: none;}}
/* RTP remove top banner on mobile */
@media screen and (max-width:767px) {
[data-section-id="619d5990f1001a58cd6cbc4e"]{display: none;}}


It's a nice solution, but I needed to replicate this block for each portfolio page. In my initial question, I was hoping for a more elegant solution. But this works.



Link to comment

Create an account or sign in to comment

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

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.