---
# System prepended metadata

title: Suay Homepage updates

---

# Suay Homepage updates
- Create new components and make existing components repeatable and reusable througout the site.
- Miro Board for reference: https://miro.com/app/board/uXjVOiCU5tY=/

## New Sections
- All will be available on all pages and product pages.
### Promo Blocks
*sections/promo-blocks.liquid*
Three to Five short quicklink thumbnails in a row.
- Blocks
    - Quicklink
        - BG Image
        - Text
        - Link
- Options
    - Spacing top / bottom

![](https://i.imgur.com/i9KmifF.jpg)


### Featured Collection
use *sections/product-upsell.liquid* as guide.
- Options
    - Spacing top / bottom
    - View All button
    - Collection
    - Column number (3 or 4)
    - First Item Promo Card?
        - Image
        - Link
        - Text

![](https://i.imgur.com/9yiKsi5.jpg)
![](https://i.imgur.com/mMLZ0H5.jpg)


### Curated Products / Promo
use *sections/product-upsell.liquid* as guide.
- Blocks
    - Product
        - Product picker
    - Promo
        - Image
        - Link
        - Text
- Options
    - Spacing top / bottom
    - View All button
    - Collection
    - Column number (3 or 4)

Same pics as Featured Collection

### Marquee Text
Get markup from *sections/product-upsell.liquid*.
- Options
    - Content
    - Speed
    - Secondary Theme Color for Background
    - Spacing top / bottom

![](https://i.imgur.com/OOiW0IW.jpg)
![](https://i.imgur.com/zunwwAQ.jpg)

### Full Promo
use *sections/home-hero.liquid* as guide.
- Options
    - Image
    - Text
    - Link
    - Link Text
    - Image Cover / Contain
    - Spacing top / bottom

![](https://i.imgur.com/Nl8Nr9A.jpg)
![](https://i.imgur.com/fDu5Wf2.jpg)

## Existing Components
- Add ablitiy to repeat on all pages including product page.
- Add  Spacing top / bottom option
- Remove marquee
### Apply to the following
1. Highlights
2. Product Upsell
3. Home-Hero
4. Split Hero


This is how to make a section available everywhere.
```
{% schema %}
{
   ...
   "templates": [
    "index",
    "product",
    "page"
  ],
  "presets": [
    {
      "name": "SECTION NAME"
    }
  ],  
 }
 {% endschema %}
```

