cookiemonster

I am having the same issue. Photo appeared normal and now all of a sudden is blurry on my live site!!

Does anyone have a solution for this?

I’m sorry, I can’t share the link as the site doesn’t belong to only me. 
 

But if anyone has any CSS tips for changing the focal point of a photo, I’d appreciate it! No worries if not. I’ll keep experimenting myself

Thanks!
 

Hello! I'm hoping someone has a solution for this issue. 🙂

On my site I have several photos with overlying text using a parallax effect (so text scrolls over the stationary background image). Unfortunately the focal point for each background image is really off on the tablet version of the site and the photo size is too big-- I need to move the focal point down and to the right. The desktop/laptop and mobile version look fine. 

Any suggestions on how to make an image smaller ("zoomed out") and change the focal point (move it down) for the tablet version only? Below is the CSS I'm using. Any thoughts would be appreciated. Thanks!

//parallax home page
[data-section-id="65d57887c2d17b03508ae8ac"]{
  .section-background{
    &::after {
    /*creating the element*/      
      content: "";
      width:100%;
      height:100%;
      position: absolute;
      
      /*adding the image*/  
      background-image:url(***);
      background-repeat:no-repeat;
      
      /*positioning the image*/  
      background-size:cover;
      background-position:center center;
      background-attachment: fixed;
      
      /*mobile*/  
      @media(max-width:750px){
        background-position:left 29% center;
        background-attachment: scroll !important;
        
        //tablet (need help with this section)
        @media(min-width:751px) and (max-width:900px){
        background-size:30px;      
      background-position:right 45% bottom 15%;
        }
      }
    } 
  }
}

Wow, brilliant! Many thanks! 

So sorry, I just changed it to https://eetietheknot.squarespace.com/ourstory

Ah, I see! Thank you very much. Here is the link for the page

https://eewedding.squarespace.com/ourstory

Hello! 

I'm trying to design a single page with TWO automatically scrolling carousels. I injected the following code into my footer, but it only made ONE of the carousels auto scroll.  The second carousel only scrolls when clicked. I placed the carousels in different sections (instead of the same section), but that didn't help.

Any idea how to correct this issue? Cheers 🙂

<!-- Summary Block Autoplay -->
<script>
window.onload = function() {
  var nextArrow = document.querySelector(".summary-carousel-pager-next");
  
  function clickNext() {
    nextArrow.click();
  }
 
  setInterval(clickNext, 4000);
};
</script>

Hmm I too am having the same issue of custom font appearing on the desktop site and preview of the mobile site but not on my actual iPhone. I initially uploaded the otf file (which worked for desktop), then tried both otf and ttf...if anyone has any pro tips for the mobile version I'd greatly appreciate it 🙂. Below is my code.

@font-face{ 
font-family: 'paperlane';
src:
url(https://static1.squarespace.com/static/65a8981e4856083a4c3f6c33/t/65d7f844c8b03007c917b181/1708652612155/Paperlane-Regular.otf);}

@font-face{ 
font-family: 'paperlane';
src:
url(https://static1.squarespace.com/static/65a8981e4856083a4c3f6c33/t/65d7f83c87964c3ca6fe3c0e/1708652604496/Paperlane-Regular.ttf);}

h1,h2, h4 {
font-family: 'paperlane'!important;}

I am also curious about the answer for hover text on mobile devices. Does anyone have any ideas? 

Ah, I made a silly mistake. I uploaded the url for the ttf file instead of the otf file. Thank you for catching that error. I really appreciate it!!! It works now.

Hello. Does anyone know if there is an update on Squarespace's end about the inability to use custom fonts? I just tried uploading and using some custom font but to no avail. I don't believe I have a typo in the code, but copy and pasted it below just in case 🙂

@font-face{ 
font-family: 'paperlane';
src:
url(https://static1.squarespace.com/static/65a8981e4856083a4c3f6c33/t/65d7f83c87964c3ca6fe3c0e/1708652604496/Paperlane-Regular.ttf);}

h1 {
font-family: 'paperlane'!important;}

Greetings 🙂

I'm a newbie to Squarespace and CSS in general. Does anyone happen to know how to make accordion description content open upward instead of downward, while still keeping the accordion title in the same fixed position?

Cheers!