KimmyBartle

Hi, I'm under a Business plan, and I'm trying to sell courses on my Squarespace storefront, but I can't seem to add them to my store page. When I try to add a course, it opens a separate page, and I can't add it under "Shop All."
Is there a workaround for this issue? Or when will courses be supported as a product type in Squarespace Commerce?

Wondering about this too. Any updates?

Hi, I'm under a Business plan, and I'm trying to sell courses on my Squarespace storefront, but I can't seem to add them to my store page. When I try to add a course, it opens a separate page, and I can't add it under "Shop All."
Is there a workaround for this issue? Or when will courses be supported as a product type in Squarespace Commerce?

Thank you! My goddddd, I thought I somehow lost permissions. Almost felt like a nudge to use 7.1 more.

Add to Design > Custom CSS
/* Show 1 row of Instagram on homepage */ div#block-yui_3_17_2_1_1642592023666_8015 .slide:nth-child(n+7) { display: none; }  

You should be able to refer to them as variables in the Custom CSS panel. For example to set the colour of an element to match the navigation link colour, you'd use:
color: var(--navigationLinkColor); Each item in the styles panel has a value. For example, the background colour of primary buttons and secondary buttons are:
var(--primaryButtonBackgroundColor); var(--secondaryButtonBackgroundColor); I hope that helps.
Did this help? Please give feedback by clicking an icon below  ⬇️

I found this snippet code here and it works fabulous!

https://codepen.io/Repkit/pen/PzJqZe

Just add the HTML as an embed block where you want your video to appear:
 
<div class="container"> <iframe class="media" width="560" height="315" src="https://www.youtube.com/embed/rk16JND1kOY" frameborder="0" allowfullscreen></iframe> </div>  
and then this part goes in the custom CSS 

 
#block-id-here .media{ -webkit-box-shadow: 10px 10px 61px 6px rgba(0,0,0,0.75); -moz-box-shadow: 10px 10px 61px 6px rgba(0,0,0,0.75); box-shadow: 10px 10px 61px 6px rgba(0,0,0,0.75); } #block-id-here .container:before { content: ''; z-index: 2; position: absolute; width: 560px; height: 315px; -webkit-box-shadow: 0 0 0 7px rgba(0,0,0,0.75); -moz-box-shadow: 0 0 0 7px rgba(0,0,0,0.75); box-shadow: 0 0 0 10px rgba(0,0,0,0.75); /* box-shadow: 0px 0px 61px 6px rgba(0,0,0,0.68); */ pointer-events: none; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; }
Here is the final result in a Squarespace web page:

You don’t need code to change the label on the ‘Add to Cart’ button. You can change this text by editing the product.
You'll find the setting in the Checkout section of the product options. Look for Custom Button and then toggle Enable Custom label and enter your preferred text.

For more information, see this help article.

I need to go in and change code for a client's website. I logged in yesterday to make the change, but I can't find the custom CSS menu option ANYWHERE. Can someone help? Am I losing my mind?

Hi!
A bit late to the party, but I've been having similar problems for quite some time with several websites running on 7.1. In my case, it mainly occurs with sections aligned to the bottom or the middle. The top-padding and/or bottom-padding of the section then becomes unnecessarily large (20vmax), as opposed to the 2.5vw spacing I set in the website's general spacing settings. This causes the section to go over the 'minimum' 100vh.
I solved this for myself using the CSS below. This makes the padding of the sections the same everywhere (in my case 2.5).
Sections aligned to the middle:
.page-section.vertical-alignment--middle:not(.content-collection):not(.gallery-section):not(.user-items-list-section):not(.section-height--custom):not(.editmode-changing-rowcount).section-height--large>.content-wrapper { padding-top: 2.5vmax !important; padding-bottom: 2.5vmax !important; } Sections aligned to the bottom:
.page-section.vertical-alignment--bottom:not(.content-collection):not(.gallery-section):not(.user-items-list-section):not(.section-height--custom):not(.editmode-changing-rowcount).section-height--large>.content-wrapper { padding-top: 2.5vmax !important; } Hopefully a final solution from Squarespace will follow soon.

You could simply use an image block with a link, for the image just use a small totally transparent PNG. Set the section to fill screen and make the image block span the full section.

Please see the following.
Let us know how it goes.

Site URL: https://www.zendaya.com
I'm looking to emulate the navigation style found here (https://www.zendaya.com), I'd also like to force it for mobile as well. Anyone able to help?