Hyde Template: A playful landing page puts the focus on your featured products.

Notes

1. Adding Custom CSS to Home > Design > Custom CSS

2. Adding !important to after, if CSS doesn’t work! for example: font-size: 20px !important;

3. If it still doesn’t work, send me a message via Contact Form  with your site url. I’ll give you exact CSS.

4. How to Find Page ID: https://beaverhero.com/squarespace-how-to/

Header

Hide Site Title

.Header-branding {
    display: none;
}
/* Mobile */
a.Mobile-bar-branding {
    display: none;
}

Hide Navigation

/* Desktop - Tablet */
.Header-nav {
    display: none;
}
/* Mobile */
button.Mobile-bar-menu {
    display: none;
}

Hide Search Icon

a.Mobile-bar-search {
    display: none;
}

Hide Header

/* Mobile */
.Mobile-bar {
    display: none;
}
/* Desktop - Tablet */
.Header {
    display: none !important;
}

Hide Cart Item

.Header .Cart {
    display: none;
}

Sticky Header

/* Desktop - Tablet */
.Header {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
}
/* Mobile */
.Mobile.loaded {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
}
/* Remove Overlap content */
main.Index {
    margin-top: 50px;
}
/* Sticky on One Page, you need to find Page ID first */
/* Desktop - Tablet */
body#collection-55fc3976e4b0308bb8c70a04 .Header {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
}
/* Mobile */
body#collection-55fc3976e4b0308bb8c70a04 .Mobile.loaded {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
}

Change Logo Color (One Page)

First, you need to find Page ID.

body#collection-55fc3976e4b0308bb8c70a04 .Heading-branding-logo {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

Create a line under the navigation menu

.Header-nav-item {
    text-decoration: underline;
}

or you can also use

.Header-nav-item {
    border-bottom: 1px solid #fff;
}

Site Title (Top) – Navigation (Bottom)

.Header-inner {
    display: flex;
    flex-direction: column;
}

Site Title (Bottom) – Navigation (Top)

.Header-inner {
    display: flex;
    flex-direction: column-reverse;
}

Site Title (Right) – Navigation (Left)

.Header-inner {
    display: flex;
    flex-direction: row-reverse;
}
[data-nc-base="header"] [data-nc-container="bottom-left"] {
    justify-content: flex-end;
}
[data-nc-base="header"] [data-nc-container="bottom-right"] {
    justify-content: flex-start;
}

Header Background Color

For Entire Site

/* Desktop - Tablet */
.Header {
    background: #ff0000;
}
/* Mobile */
.Mobile-bar {
    background-color: #ff0000 !important;
}

For one page, you need to find Page ID

/* Desktop - Tablet */
body#item-560d4e1ce4b0f68fd09290d0 .Header {
    background: #ff0000;
}
/* Mobile */
body#item-560d4e1ce4b0f68fd09290d0 .Mobile-bar {
    background-color: #ff0000 !important;
}

For Product Details Page

/* Desktop - Tablet */
.view-item.collection-type-products .Header .Header {
    background: #ff0000;
}
/* Mobile */
.view-item.collection-type-products .Header .Mobile-bar {
    background-color: #ff0000 !important;
}

Footer

Footer background color

/* Entire Site */
footer.Footer {
    background: #ff0000;
}
/* One Page */
body#collection-55fc3976e4b0308bb8c70a04 footer.Footer {
    background: #ff0000;
}

Remove Footer Navigation

.Footer-nav {
    display: none;
}

Remove Footer Social

.socialaccountlinks-v2-block {
    display: none;
}

Shop – Product

Change Sale Color

.product-mark.sale {
    background: #ff0000;
    color: #000;
    font-size: 20px;
    border-radius: 0 !important;
}

Change Sold out color

.ProductList-statusWrapper .product-mark.sold-out {
    background: #ff0000;
    color: #000;
    font-size: 9px;
    border-radius: 0;
}

Align Title & Price

.ProductList-meta {
    text-align: left !important;
}

Remove spacing between Title & Image

.ProductList h1.ProductList-title {
    margin-top: 2px;
}

Change price symbol

body.native-currency-code-usd .sqs-money-native:before {
    content: "AUD";
}

Remove Add to Cart

.sqs-add-to-cart-button-wrapper {
    display: none !important;
}

Remove Product Social Icon

.ProductItem-details-share {
    display: none !important;
}

Remove Product Thumbnail images

.ProductItem-gallery-thumbnails {
    display: none;
}

Move Add to Cart between Price & Description

.ProductItem-details .sqs-add-to-cart-button-wrapper {
    order: 3;
}
.ProductItem-details .product-price {
    order: 4;
}

Featured Image: Squarespace.com