# Getting started

Chapter 1 of the Tress user guide.

## What's in your download

| File | What it is |
| --- | --- |
| `Tress-1.0.0-tress.zip` | The theme with the **Tress** preset: hair extensions, closures, frontals and wigs |
| `Tress-1.0.0-lacquer.zip` | The theme with the **Lacquer** preset: press-on nails |
| `Tress-1.0.0-flutter.zip` | The theme with the **Flutter** preset: strip lashes, for lash brands and lash techs |
| `Tress-user-guide.pdf` | This guide |
| `LICENSE.txt` | Your licence: one store per purchase |

The three zips are the same theme. A preset only decides the starting palette, fonts, a few settings, words, home page, product page, contact and length guide pages, header and footer, and you can change all of them afterwards. Products, photos and demo text are not included: a fresh install shows your own products, and sections that need a product or collection show placeholders until you choose one.

## Presets

| Preset | For | Palette | Fonts | Home page |
| --- | --- | --- | --- | --- |
| Tress | Hair extensions, closures, frontals and wigs | Onyx (dark) | Abril Fatface headings, Poppins body | A **Mirror trio** hero ("Raw hair, flawless installs", three ticks, a length ruler marked 22 in and a product tag), **Shop by texture** (Straight, Body wave, Deep wave and Kinky curly as tall texture mirrors), Best sellers (8 products), **Build your install**, the **Length guide** spotlight ("Not sure about length? See every length on the chart"), a wigs rail ("Wigs, ready in ten minutes"), testimonials ("Installs that turn heads"), **Install of the week** (five staggered mirrors) and the newsletter on the hot-pink band ("Join for 10% off your first install") |
| Lacquer | Press-on nails | Candy | Syne headings, Poppins body | A Mirror trio hero ("Salon nails in ten minutes"), **Shop by shape** (Almond, Coffin, Square, Stiletto and Oval), New sets (8), a sizing kit story ("Not sure of your size? Try them all first"), **Apply in 3 steps**, testimonials ("Sets people can't stop asking about") and the newsletter ("First pick of every drop") |
| Flutter | Strip lashes, for lash brands and lash techs | Nude | Faculty Glyphic headings, Poppins body | A Mirror trio hero ("Lashes that feel like nothing"), **Find your lash style** (Wispy, Natural, Cat eye, Dramatic and Doll), "Wear up to 20 times" with three ticks, Best sellers (8), **Lash care** in three steps, a lash tech panel ("Lash techs: open a trade account"), testimonials ("Lashes our clients ask about") and the newsletter ("New styles, first") |

The presets also differ in a few settings:

* **Tress**: **Length chart page** is the page with the handle `length-guide`, **Build your install page** is `/#install` (the install builder on the home page), and the header's utility link reads "Length guide". **Bag note**: "Free silk bonnet with every install".
* **Lacquer**: **Sizing kit product** is the product with the handle `nail-sizing-kit`, and the header's utility link reads "Find your size" (to `/pages/nail-size-guide`). **Bag note**: "Glue, tabs and a prep kit in every set".
* **Flutter**: no header utility link, and the product page's details panel is headed "Lash details". **Bag note**: "Free lash glue over $40". It also ships a `product.trade` template with a Quick order list ("Order by the tray") for lash techs who restock by the tray.

All three use capsule product images, quick add and the second image on hover. The fourth palette, **Chrome** (cool silver, an ink-violet accent and chrome-gradient badges), has no preset of its own; choose it in Theme settings › Colors on any preset.

Every preset's product page has the same buy box: the collection and rating line, the title, the price with Shopify's instalments message under it, the variant picker (which draws the length scale, texture chips, nail chips and sizes from your options, chapters 8 and 10), the buy buttons with the price in them, a back-in-stock request, pickup availability, three **trust rows**, the description and two collapsible rows ("Shipping and returns" and a how-to). Under the photos sit the **Hair details** label and the **Care** card (chapter 11), then a row of recommendations. Each preset's product page has its own sample text:

* **Tress**: trust rows "Order by 2 pm for same-day dispatch", "Free silk bonnet with every install" and "30-day returns on unopened lace"; the how-to is "How to install a frontal"; recommendations "Complete the install".
* **Lacquer**: "Order by 2 pm for same-day dispatch", "Free prep kit with every set" and "Reusable up to 3 times with care"; "How to apply press-ons"; "Finish the set".
* **Flutter**: "Order by 2 pm for same-day dispatch", "Cut to fit, wear up to 20 times" and "30-day returns on unopened trays"; "How to apply strip lashes"; "Complete the look".

The trust rows and collapsible rows are sample text: rewrite them to your own terms, or remove them.

Every preset also ships these templates, which you assign to pages in admin (**Online Store › Pages**, then the page's **Theme template** field):

| Template | Use it for | What's on it |
| --- | --- | --- |
| `page.length-guide` | Your length chart (chapter 8) | The page's title and content, the **Length guide** section ("Every length on one chart") with the figure and your landmarks, and a Rich text section for your own chart |
| `page.contact` | Your contact page | The contact form with an order number field and a "Before you write" text column |
| `page.compare` | Side-by-side comparison (chapter 4) | The comparison table |

The presets' buttons and links point to pages and collections that a fresh store doesn't have yet. Create them with these handles, or point each link at your own as you build:

* **Tress**: collections `bundles`, `closures-and-frontals`, `wigs`, `best-sellers`, `straight`, `body-wave`, `deep-wave` and `kinky-curly`; a page `length-guide` with the `page.length-guide` template. The hero's second button and the Bundles menu promo go to `/#install`.
* **Lacquer**: collections `new-sets`, `almond`, `coffin`, `square`, `stiletto` and `oval`; a page `nail-size-guide`; a product `nail-sizing-kit`.
* **Flutter**: collections `lash-styles`, `best-sellers`, `wispy`, `natural`, `cat-eye`, `dramatic` and `doll`; pages `lash-care` and `for-lash-techs`.
* **All three**: a page with the handle `contact` and the `page.contact` template (the cap guide's "Write to us" link uses it), and the testimonials' "Read every review" link goes to `/blogs/news`.

## Install

1. In Shopify admin, go to **Online Store › Themes**.
2. In the **Theme library**, click **Add theme › Upload zip file** and choose the zip of the preset you want. Don't unzip it first.
3. When the upload finishes, click **Customize** to open the theme editor and make it yours.
4. When you're ready, click **Publish** (on the theme's **…** menu in the library, or from the editor). You can upload a second preset next to it to compare; only the published theme is live.

## First steps

1. **Brand**: Theme settings › Brand: your logo, or the shop name as a text wordmark in the heading font, and a favicon.
2. **Colors and fonts**: Theme settings › Colors › Color palette, then Typography (chapter 2).
3. **Menus**: in admin, **Content › Menus**: build the main menu and the footer menu (chapter 3).
4. **Options**: name your options the way Tress expects (Length, Texture, Lace, Density, Cap size, Shape, Nail length, Size), or tell the theme your own names in **Theme settings › Hair, lashes and nails** (chapter 7). This is what turns plain option tiles into the length scale, texture chips and nail sizer.
5. **Product data**: create the metafield definitions in chapter 7 and fill them on a few products to see the hair details, care steps, install weights and card meta lines appear.
6. **Real promises**: the presets ship with demo words. Rewrite the announcement bar, the hero's ticks, the trust rows, the product page rows, the install builder's deal line and the newsletter so they only promise what you offer, and replace the sample testimonials with real ones.
7. **Installs**: if you sell bundles, choose the Bundles and Closures and frontals collections in the **Bundles and installs** section, and create the automatic discount behind the deal line (chapter 9).
8. **Filters**: install Shopify's free **Search & Discovery** app and add Texture and Length filters (chapter 13).