Instructions

 

Extension Uninstall Survey (Responses): 
https://docs.google.com/spreadsheets/d/1DbmxlasvYI-CqXoKohapVkM9DqMRCYtfCQp0ltQW70c/edit#gid=0

Suggest a Brand (Responses)
https://docs.google.com/spreadsheets/d/1qUgta0ecG1kxilSMuHk01EMXR-Nr4Qj9EUjaqGOie_o/edit#gid=0

DoneGood Partner Brand Application (Responses)https://docs.google.com/spreadsheets/d/1Q8t22BPWJa63rXOjZsE4FNAs4t7MSQww_gPDsAOC3eY/edit#gid=0

 

Slideshow banner

You can use an Index Page to create the effect of a slideshow page banner:

  1. Create an Index Page.

  2. Add a gallery section with multiple images as the first section.
  3. In the Index: Gallery section of the Style Editor, choose Layout: Slideshow. (This tweak affects all gallery sections on your site.)
  4. In the Index: Slideshow Gallery section, ensure Gallery Autoplay is checked.
  5. Add a content section below the gallery section, and add your page content to it

Highlighted Banner

<h1><font color=white>
  
  The unique, the simple, the natural, <span style="background-color: #ef5920">the good.</span></font></h1>

 

Image Overlay with Text

<style>
.container {
  position: relative;
  width: 100%;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: #ef5920;
}

.container:hover .overlay {
  opacity: 1;
}

.text {
  color: white;
  font-size: 14px;
  position: absolute;
  top: 0;
  left: 0;
  text-align: left;
  margin: 1.0rem 1.0rem;
}  
</style>

<div class="container">
  
    <img src="https://static1.squarespace.com/static/5b2c1a1a5ffd2017e9d3ae72/5b2d979d758d46cbc9266a09/5b301ce2352f53e665874fea/1529879794128/CauseGear.png?format=1500w" alt="Featured Brand" class="image">
  <div class="overlay">
    <div class="text">


      <a href="https://donegood.ckmtrk.com/?a=2&c=269&p=r&s1=WEBSITE_FEATURED" target="_blank">CAUSEGEAR'S life-changing bags and accessories are handcrafted with care by women and men freed from trafficking and extreme poverty in India.
        
        <br><strong>Save 20% off your first order with promo code DONEGOOD
      </strong></a>
    
    </div>
  </div>
</div>

 

Banner with Menu

<h1><font color=white>
  
  Make the world better with every purchase.</font></h1>
  
  <h3><font color=white>
    
  
<strong>
  Discover
    <style>
/* Style The Dropdown Button */
.dropbtn {
    background-color: #ef5920;
    color: white;
    padding: 5px 20px;
    border: none;
    cursor: pointer;
}
<div class="custom-select" style="width:150px;">
/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 260px;
    box-shadow: 0px 8px 16px 0px rgbahsla(16, 86, 71, 0.1);
    z-index: 1; 
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
      padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:link, .dropdown-content a:visited {
    background-color: #ffffff;
    color: #000000;
}

.dropdown-content a:hover {
    background-color: #ef5920 !important;
    color: #ffffff !important;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
    background-color: #ef5920;
}
</style>

<div class="dropdown">
  <button class="dropbtn"><strong>  brands▾ </strong> </button>
  <div class="dropdown-content"><font size=2><strong>
    <a href="https://shop.donegood.co/c/womens-clothes">Women's Clothes</a>
    <a href="https://shop.donegood.co/c/mens-clothes">Men's Clothes</a>
    <a href="https://shop.donegood.co/c/shoes">Shoes</a>
        <a href="https://shop.donegood.co/c/bags">Bags &amp; Accessories</a>
        <a href="https://shop.donegood.co/c/home">Home Goods</a>
     <a href="https://shop.donegood.co/c/everyday-essentials">Everday Essentials</a>
        <a href="https://shop.donegood.co/gift-guide/for-her">Gifts</a>
       <a href="https://shop.donegood.co/">And More</a>
      
    </strong></font></div>
</div>
    
    that  
    
    <style>
      
     
/* Style The Dropdown Button */
.dropbtn {
    background-color: #ef5920;
    color: white;
    padding: 5px 20px;
    border: none;
    cursor: pointer;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 260px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
      padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #000000}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
    background-color: #000000;
}
</style>

<div class="dropdown">
  <button class="dropbtn"><strong> do good▾ </strong> </button>
  <div class="dropdown-content"><font size=2><strong>
    <a href="https://shop.donegood.co/v/green">Eco-Friendly</a>
    <a href="https://shop.donegood.co/v/workers">Empower Workers</a>
    <a href="https://shop.donegood.co/v/givesBack">Give Back</a>
      <a href="https://shop.donegood.co/v/minority">Women/ Minority-Owned</a>
    <a href="https://shop.donegood.co/v/organic">Organic &amp; GMO-Free</a>
    <a href="https://shop.donegood.co/v/crueltyFree">Cruelty-Free</a>
    <a href="https://shop.donegood.co/v/madeInUSA">Made in the USA</a>
    <a href="https://shop.donegood.co/v/vegan">Vegan</a>
       
    </strong></font></div></div></strong></font></h3>

Resources

Brine banners
https://support.squarespace.com/hc/en-us/articles/115015895907-Brine-banners