Sandbox Jekyll documentation

Component Variations

Guide to all available navbar, footer, and header variations in the Sandbox theme

Center Nav Variations

{% include components/navbar/navbar.html 
    classList="center-nav transparent navbar-light"
    logoBoth=true
    logoAlt="logo-dark"
    otherClassList="w-100 d-flex ms-auto"
    otherSearch=true
    otherBtn=true
    otherBtnClassList="btn btn-sm btn-primary rounded"
    otherBtnText="Contact"
%}

Fancy Navbar Variations

{% include components/navbar/navbar-fancy.html 
    wrapperClass=""
    classList="fancy navbar-light navbar-bg-light caret-none"
    centerNav=true
    fancy=true
    logoAlt=true
    otherClassList="w-100 d-flex ms-auto"
    otherSocial=true
%}
{% include components/footer/footer.html 
    style="default"
    bg_color="bg-light"
    text_color=""
    newsletter=true
    cta=true
    cta_title="Join our community"
%}
{% include components/footer/footer.html 
    style="minimal"
    bg_color="bg-light"
    text_color=""
%}

Header Variations

About Header

{% include components/header/header-about.html 
    background_class="bg-soft-primary"
    title="About Us"
    subtitle="A company turning ideas into beautiful things."
    figure_image="/assets/img/photos/bg12.webp"
%}

Blog Post Header

{% include components/header/header-post.html 
    background_class="image-wrapper bg-image bg-overlay text-white"
    background_image="/assets/img/photos/bg5.webp"
    category="Teamwork"
    title="Commodo Dolor Bibendum"
    meta_date="5 Jul 2022"
    meta_author="Sandbox"
%}

Configuration Options

Common Parameters

# Navbar Parameters
classList: "center-nav transparent navbar-light"
logoBoth: true
logoAlt: "logo-dark"
otherClassList: "w-100 d-flex ms-auto"
otherSearch: true
otherBtn: true

# Footer Parameters
style: "default"
bg_color: "bg-light"
text_color: ""
newsletter: true
cta: true

# Header Parameters
background_class: "bg-soft-primary"
title: "Page Title"
subtitle: "Page subtitle"
figure_image: "/path/to/image.webp"