Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search


Squarespace Employee
  • Content Count

  • Joined

  • Last visited

Everything posted by TreyT

  1. The page you linked to doesn't have anything entered for the code injection. The code would need to be added to each page you need the quantity to be hidden on. Can you add the code to the code injection on the page you linked, and enable the quantity on service products to confirm if you still have the same problem?
  2. @korbendallas23 I'm not too sure what the setup is from the screenshot, but you might try adding this rule in addition to the one above: .sqs-gallery-block-grid { overflow: visible } In the context of the code I posted originally, it would be placed within the @media query so all the code would end up looking like this: @media only screen and (max-width: 640px) { .sqs-gallery-design-autogrid-slide { width: 33.3% !important; clear:right !important; } .sqs-gallery-block-grid { overflow: visible } } If that's not working, you might post a link to your site.
  3. For anyone wanting to do something similar for Commerce, where it should redirect to a custom page after checkout, rather than the normal Order Confirmation page, this same tag can work for that too. This would go under Settings > Advanced > Code Injection > Order Confirmation Page.
  4. It looks like the answer offered hides the Add to Cart, and the Price as well. If you only want to hide the Quantity input field but keep all the rest, you can add this to the custom CSS editor: .product-quantity-input { display:none !important; } This will affect products site wide, so if you need this for only a specific product page, you can add this in style tags via the page header code injection: <style> .product-quantity-input { display:none !important; } </style>
  5. In order to just remove the $ only, you can use the following in the Custom CSS: body.native-currency-code-usd .sqs-money-native:before { content: none; }
  6. Try adding this to the CSS Editor under the Design Menu: .collection-type-gallery.full-view #backToThumbs { font-size: 5.0em; } This should make it pretty big. Feel free to adjust the em value to customize. Good luck!
  7. The code for this is a little different if you've opted to use a slideshow in your banner. Instead use this code, which worked for me: .meta .meta-description p { text-align: left; width: 100% !important; }
  8. You might consider something like Google Maps, which would allow you to create a custom map with multiple points, then embed this into your site. See the thread below for discussion about this: https://answers.squarespace.com/questions/35300/can-i-add-multiple-locations-on-a-map.html
  9. This should work: .entry-meta { display: none; }
  10. Forms on a Cover Page use the Background color from the Cover page Styles. See the KB guide here: https://support.squarespace.com/hc/en-us/articles/206544197
  11. Try this for Summary Blocks: @media only screen and (max-width: 640px) { .sqs-gallery-design-autogrid-slide { width: 33.3% !important; clear:right !important; } }
  12. If you wanted to have rows of 3 images on mobile displays, you could add the following code to your CSS Editor: @media only screen and (max-width: 640px) { .sqs-gallery-design-grid-slide { width: 33.33% !important; } } 33.33% is roughly a third of the total width of the area your Grid Gallery Block lives in. This makes each image take up a third of the width. If you need more than three rows you would have to make that percentage an equal percentage of the total width of the page area for the number you are going for, (such as 25% for 4 columns etc.) in order to force the images to size that way. If you need this only for one page or specific pages, place it between style tags in the page's header code injection: <style> @media only screen and (max-width: 640px) { .sqs-gallery-design-grid-slide { width: 33.33% !important; } } </style> I hope that helps!
  13. Using images with a 3:2 or 4:3 ratio will work on most devices. You can use the focal points to target the most important parts of the image, so that it always centers on that area even when it crops. Avoid using images that have important parts of the image around the edges, as this may get cropped out on mobile. More about image best practices for Squarespace: https://squarespace.zendesk.com/hc/en-us/articles/206542517
  14. In addition to this, the class or ID assigned to the logo image can change from template to template. For instance, the target for Pacific or Fulton for the logo image would be "#logoImage" rather than ".logo". For Flatiron, use the class ".siteTitle" With that in mind, be sure to inspect the element on your logo image to figure out the ID or class and update the code above accordingly.
  15. This can be used to remove the menu icon if needed: #mobile-navigation #mobile-navigation-label::before { display: none; } Hope that helps others who got this to work!
  • Create New...