AudeyTheConductor

Site URL: https://www.newconductorsorchestra.org Hello SQSP forum, I am trying to change the second slide banner slideshow background only on mobile to another uploaded image. I think I've figured out how to isolate the second slide -- I've been able to put a border on it!-- but don't know how to upload the image itself. Here's code I have so far @media only screen and (max-width: 640px){ #collection-61e9e0f678724a292e138438 { .list-item[data-is-card-enabled="true"]:nth-child(2) {img:url(https://static1.squarespace.com/static/61e9e0a1c56e13742a1a45a4/t/6321e7846d4fcd546b6acafa/1663166341170/SQSP+mobile+background+image+for+conductors.png)!important; background-repeat:no-repeat!important; background-size:cover!important; background-position: center!important;} } } Any help is greatly appreciated! Thank you!

Thanks @paul2009 for the additional info. It's great code! I will let my client know the options. Hopefully SQSP can work this into one of their updates.

Hi @tuanphan-- yes this is "upcoming events" which will be a series of flyers Yes @Ziggy -- the code is in my footer. So far, the images are still not clickable. Any advice would be greatly appreciated.

Hi @Ziggy! Thanks for posting your tutorial. I have added the code to my footer (and have not yet hid the buttons with the links) but the images are still not clickable.

Site URL: https://tbabeta.squarespace.com/ Password: tbatest Hi Everyone- is there a way to make the picture itself a clickable link? I am using the list section as a way to display flyers, and don't want to use a button to distract from the design. Any guidance would be much appreciated. Thanks!

Site URL: https://www.drmommymilk.com Hello SQSP! I have had an image as a custom mobile background as this site, but it is not showing up anymore. Any ideas & solutions are greatly appreciated. Here is the custom code .header-menu .header-menu-bg{ background-image:url(https://static1.squarespace.com/static/6129a21c0052b165b542a556/t/612c27d2bc615f30943c1122/1630283730785/Untitled+design+%282%29.png); background-size:150%!important;} Thanks!

fantastic, thank you @bangank36!

Site URL: https://audreyconducts.squarespace.com/web-design-copy Howdy Everyone, I am aiming to create a testimonial slider. I have added a gradient to each card, and altered the arrow color However, I would like to round the corners of the "white" section, which is I think just the absence of the gradient background (when I remove the gradient code, everything is white except for the text and the arrows!) Any help rounding the corners would be greatly appreciated! Here is the code affecting this section. /*gradient testimonial slider*/ .list-item[data-is-card-enabled="true"] {background: linear-gradient(to right, #9062a1, #bfb1c4)!important; border-radius:50px;} .user-items-list-banner-slideshow__arrow-icon-background {background-color:hsl(28, 5%, 38%)!important; opacity:(.85)!important;}

Site URL: https://www.audreyjedelstein.com/calendar Hello Everyone! I have an event list page on my site. For my past events there is a "view event" button which is built in from Squarespace. The View Event button does not show up on my FUTURE events, and I would like it to. Does anyone know how to do make it visible/ know why it's hidden? TY ~Audrey

@tuanphan thank you!!

Site URL: https://newconductorsorch.squarespace.com/faq https://newconductorsorch.squarespace.com/faq PW: newconductors The gist of the question: I currently have a white logo that disappears on a white mobile overlay background. I would like the mobile overlay to have a completely different logo. This page (FAQ) has color logo, but I've used the SquareKicker extension to use a filter to make it white. My "solution" for the mobile overlay is to use a completely different logo-- for ALL pages! [SquareKicker is not able to help me.] I have injected this into my header to try to replace the logo for mobile overlay across ALL pages. I would appreciate any advice or solutions you could give! <style> /* hide current image */ body:not(.header--menu-open) .header-title-logo img { visibility: hidden!important; } /* set new image on burger menu click */ body:not(.header--menu-open) .header-title-logo a { background-image: url(https://static1.squarespace.com/static/61e9e0a1c56e13742a1a45a4/t/622017f14c29f83be16f38e8/1646270449115/Submark+Black.png)!important; background-size: cover!important; background-repeat: no-repeat!important; } </style>

Hi! I am having a similar problem on my site https://newconductorsorch.squarespace.com/faq PW: newconductors This white logo disappears into the mobile overlay. This is actually a color logo, using SquareKicker to make it white. My "solution" is to use a completely different logo on the mobile overlay. [SquareKicker is not able to help me.] I have injected this into my header, it is not showing up at all. <style> /* hide current image */ body:not(.header--menu-open) .header-title-logo img { visibility: hidden!important; } /* set new image on burger menu click */ body:not(.header--menu-open) .header-title-logo a { background-image: url(https://static1.squarespace.com/static/61e9e0a1c56e13742a1a45a4/t/622017f14c29f83be16f38e8/1646270449115/Submark+Black.png)!important; background-size: cover!important; background-repeat: no-repeat!important; } </style> any ideas @tuanphan?

Thanks @tuanphan!

Site URL: https://newconductorsorch.squarespace.com/ Site URL: https://newconductorsorch.squarespace.com/ PW: newconductors Hi Everyone! I am trying to center my list item buttons for my mobile view. I have tried this code but it doesn't work: .list-item-content__button {text-align:center!important} Any ideas?