Buy me a coffee

Move Header to bottom of Screen

Add these codes to Custom CSS box

Desktop Only

/* Desktop Only */
@media screen and (min-width:768px) {
header#header {
    position: fixed;
    bottom: 0;
    top: unset;
    z-index: 9999;
    background-color: white !important;
}
}

Mobile Only

/* Mobile Only */
@media screen and (max-width:767px) {
header#header {
    position: fixed;
    bottom: 0;
    top: unset;
    z-index: 9999;
    background-color: white !important;
}
}

Blog Page (List)

/* Blog Page (list) */
[class*="type-blog"].view-list {
header#header {
    position: fixed;
    bottom: 0;
    top: unset;
    z-index: 9999;
    background-color: white !important;
}
}

Blog Post

/* Blog Post */
[class*="type-blog"].view-item {
header#header {
    position: fixed;
    bottom: 0;
    top: unset;
    z-index: 9999;
    background-color: white !important;
}
}

Event List

/* Event List */
[class*="type-event"].view-list {
header#header {
    position: fixed;
    bottom: 0;
    top: unset;
    z-index: 9999;
    background-color: white !important;
}
}

Event Detail

/* Event Detail */
[class*="type-events"].view-item {
header#header {
    position: fixed;
    bottom: 0;
    top: unset;
    z-index: 9999;
    background-color: white !important;
}
}

Shop/ Category

/* Shop/Category */
[class*="type-products"].view-list {
header#header {
    position: fixed;
    bottom: 0;
    top: unset;
    z-index: 9999;
    background-color: white !important;
}
}

Individual Product

/* Individual Product */
[class*="type-products"].view-item {
header#header {
    position: fixed;
    bottom: 0;
    top: unset;
    z-index: 9999;
    background-color: white !important;
}
}

Cart Page

/* Cart Page */
body#cart {
header#header {
    position: fixed !important;
    bottom: 0;
    top: unset;
    z-index: 9999;
    background-color: white !important;
}
}

Homepage Only

/* Homepage Only */
body.homepage {
header#header {
    position: fixed;
    bottom: 0;
    top: unset;
    z-index: 9999;
    background-color: white !important;
}
}

Other Pages (exclude homepage)

/* Other pages - exclude homepage */
body:not(.homepage) {
header#header {
    position: fixed !important;
    bottom: 0;
    top: unset;
    z-index: 9999;
    background-color: white !important;
}
}

All Pages

/* All Pages */
header#header {
    position: fixed;
    bottom: 0;
    top: unset;
    z-index: 9999;
    background-color: white !important;
}

One Page

Add this code to Page Header Code Injection and Save

<!-- One Page -->
<style>
header#header {
    position: fixed;
    bottom: 0;
    top: unset;
    z-index: 9999;
    background-color: white !important;
}
</style>

 

Ask me a question, free

If your site is private or in trial, just setup password and share url. See how to: https://beaverhero.com/squarespace-how-to/
Please check your email carefully. Recently I got a lot of questions with wrong emails.

If you haven't heard from me within 24 hours please check your junk/spam folder