Documentation

Cadre — User Guide

Everything you need to set up, customize, and get the most out of your Cadre theme.

01

Getting started

Installing Cadre

Download the theme ZIP from your purchase email, then in your Shopify admin go to Online Store → Themes → Add theme → Upload zip file. Once uploaded, click Customize to open the Theme Editor.

Choosing a preset

Cadre ships with 5 style presets: Cadre (minimal luxury), Couture (warm editorial), Boutique (artisan), Gallery (clean modern), and Noir (dark elegance). Each preset configures typography, colors, and spacing. Go to Theme Settings → Theme presets to switch.

Adding your logo

In the Theme Editor, open the Header section. Upload your logo via "Logo image" and adjust "Logo width" (50–250px). If your brand uses text, leave the logo field empty — the shop name will be used as a typographic wordmark.

02

Customization

Colors

Theme Settings → Colors. Cadre uses 6 color schemes. Each scheme has background, text, primary, secondary, accent, and border. You can mix schemes across sections — e.g., a dark hero followed by a light product grid.

Typography

Theme Settings → Typography. Choose heading and body fonts from Shopify's 500+ font library. Adjust heading scale (80–150%), letter spacing, and text transform (uppercase, lowercase, none).

Spacing scale

Theme Settings → Layout → Spacing scale. "Default" suits most stores. "Relaxed" adds more whitespace for a luxury feel. "Compact" is denser, good for high-volume catalogs.

03

Sections

Adding a section

In the Theme Editor, on any template, click "Add section" at the bottom of the sidebar. Cadre offers 25+ section types: hero, tabbed collection, lookbook, before/after, testimonials, FAQ, and more.

Lookbook

Create editorial fashion layouts. Add "Look" blocks, each with a lifestyle image and a linked product. Hotspots appear on the image on hover.

Before/After slider

Compare two product colorways. Upload "Left image" (e.g., natural tan) and "Right image" (e.g., classic black). Users drag the handle to compare. Labels are customizable.

Collection list page

Layout options: Auto (smart), Editorial (hero + grid), or Grid (uniform). Columns: 2, 3, or 4. Aspect ratios: 1:1, 3:2, 4:5, 16:9. Title position: overlay on image or below.

04

Product pages

Gallery

Stacked scroll on desktop, swipe on mobile. Click any image to open the lightbox with prev/next navigation and zoom. No setup needed.

Color swatches

Set up under Products → [Product] → Variants → Color. Cadre uses Shopify's native swatch API. Supports image-based swatches for fabric patterns.

Size chart

Add a "Size chart" block to the product template. Link to a Shopify page with a size table. It opens in an accessible modal with focus trap.

Trust indicators

Configurable block with 3 icons (shipping, returns, secure). Edit text per language via Shopify's Translate & Adapt app.

05

Cart

Drawer vs page

Theme Settings → Cart → Cart type. Drawer is faster (no page reload). Page offers more space for editing quantities and viewing images. Drawer is recommended for most stores.

Free shipping bar

Theme Settings → Cart → Show free shipping bar. Set your threshold (e.g., 50). The bar shows progress and switches to a celebration message when unlocked.

Cart upsells

Automatic on desktop — shows related products from the same collection. Hidden on mobile for cleaner checkout flow.

06

Translations

Supported languages

Cadre includes 5 built-in languages: English, French, German, Spanish, Italian. The theme UI (buttons, labels, messages) is fully translated.

Publishing a language

Shopify Admin → Settings → Languages → Add language → publish. The theme's language selector will appear automatically in the header and footer.

Translating content

Install Translate & Adapt (free, by Shopify) to translate products, collections, pages, and navigation menus. Theme UI is already translated.

07

Performance

Lighthouse scores

Cadre ships with 95+ Lighthouse performance. Tips to maintain: use WebP images, keep hero images under 1.5 MB, limit homepage sections to ~12, avoid heavy third-party apps.

Image optimization

Shopify automatically serves WebP and resizes images. Cadre uses responsive `srcset` with proper `sizes`, `width`, `height` attributes to prevent layout shift (CLS).

Third-party apps

Every app you install adds JavaScript. Remove apps you don't use. Use Shopify's "Customer events" dashboard to audit what's loaded.

08

Support

Response time

Email support: under 24 hours on business days. Included for 6 months with your theme purchase. Extendable on request.

What's covered

Installation help, configuration questions, bug fixes, compatibility issues. Not covered: custom code modifications (we can quote separately).

Reporting a bug

Email contact@unsetthemes.com with: your store URL, affected page, expected vs actual behavior, and a screenshot or screen recording.

Still need help?

Our team is here to help you make the most of your Cadre theme. Response within 24 hours on business days.

Contact support