Jump to content


  • Posts

  • Joined

  • Last visited

1 Follower

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Hi Tuan, I want that last carousel to only display one column but it's showing two as I am using a code to display 2 columns on the other carousels.
  2. Hi Tuan, I have now sorted this myself, no need to worry! Here are the codes I used if anyone was wondering: // Hide slideshow controls on Desktop .desktop-arrows.arrow-container{ display : none; } // Hide slideshow controls on Mobile .mobile-arrow-button.mobile-arrow-button{ display : none; }
  3. Hiya, thanks for your css suggestion. Unfortunately this didn't work properly for me but i went with the second approach (not sure why I didn't think of just doing that in the first place!) thanks!
  4. Hm unfortunately this doesn't seem to be working... I replaced my old code with this one but it didn't change anything. Any other ideas? I've checked the rest of my custom css and I don't think I have any conflicting codes running. P.S. The section ID you used in your code was actually for a different section, not the third carousel (the third carousel on my homepage is actually hidden on desktop view, so there is 2 carousels on desktop but 3 on mobile). Of course I just replaced this with the section ID of the third carousel (below), but nevertheless this didn't work. section[data-section-id="664f1c4cc443c128632ff36b"] Thanks for your time!
  5. Hi guys, I have a slideshow as the first section on my homepage. I have used the below custom code to shorten the length of the slideshow on mobile view. //Decrease slideshow height on mobile @media screen and (max-width:767px) { .user-items-list-banner-slideshow { height: 50vh !important; } } This has worked well, however I was wondering if a code can be used to resize/adjust the placement of the images on mobile view only? The slideshow images look great on desktop, but they're only showing a fraction/zoomed in on mobile. I will attach screenshots for reference. Thanks! site: https://threadsonline.co.uk/ password: welcome
  6. Hi guys, I am using some custom css to change the word 'login' to an icon. This has worked, apart from when i hover over the icon, the word 'login' appears. This may be because i am using another code to highlight my header navigations in red upon hover. How do i get the codes to not conflict, as I do not want the word 'login' to appear on hover. Please see codes I am currently using below: //Change 'login' from text to icon a.user-accounts-text-link { background-image: url(https://images.squarespace-cdn.com/content/v1/63a1cbd8a8a1d321d19b9b71/3b69346d-5e04-46eb-86a4-5b3595151c4f/login.png?format=500w) !important; background-size: contain; background-position: center; background-repeat: no-repeat; color: Transparent !important; height: 23px } //Bold & red header categories on hover .header-nav-item>a:hover { font-weight: bold !important; color: red !important; } .header-nav-folder-item:hover a { font-weight: bold !important; color: red !important; } I will attach some screenshots of whats happening below. site: https://threadsonline.co.uk/ password: welcome Thanks!
  7. Hi guys, I am currently using the following code so that on mobile display my carousels show up 2 columns rather then 1. @media screen and (max-width:767px) { body.homepage ul.user-items-list-carousel__slides { grid-template-columns: repeat(2,1fr) !important; } } I have three carousels on my home page, the first two are the ones I want to use the above code for, but I want the last carousel to only show 1 column at a time. However, because of the code, all three carousels are showing 2 columns. How do I get the last carousel to be excluded from the above code? Site: https://threadsonline.co.uk/ Password: welcome
  8. Hi, I am trying to remove/hide the controls on my slideshow which is the first section on my home page. Previously I have changed the controls from arrows to circles, but now I just want the controls hidden completely. I have tried this code but no luck: .gallery-slideshow-controls { display : none; } An important thing to note is that I have a code injection making the slideshow move automatically, so I am not sure if this is affecting the custom css. Thanks!
  9. Hi @tuanphan - after an hour of tweaks I have fixed the above issue, thanks for all your help anyway!
  10. Thanks 🙂 In regards to the accordion issue, I put this code into the footer injection in order to move the accordion from the footer into the product page: <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> jQuery(document).ready(function($){ $('footer.sections .accordion-block').appendTo('.sqs-add-to-cart-button-wrapper'); }) </script> But the issue is - I have 2 accordions in my footer but only want one of them to show on the product page. We have managed to do this so far, but now the accordion I actually want showing in my footer (in mobile view only) has disappeared. You can see on mobile view that there is a big white gap in my footer, this is where the accordion is but it is hidden for some reason.
  11. Hi Tuan, all worked great thank you! Could you advise how I decrease the gap between the description & price/title on mobile please? Also in regards to the accordion I think you may have missed my message above. Your code removed the additional accordion from my product page which I wanted, but it has also hidden it from the footer as well (you can see there is a big white gap on mobile display in the footer, this is where the accordion is but the ode has hidden it). How can I get it to show only in the footer?
  12. Hi Tuan, I have just realised it has now hidden the accordion from the footer as well as the product page, but I need it to display in the footer.
  • 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.