(Getting started)
Getting started
Vale is a quiet, editorial Shopify theme for houses that sell furniture, lighting and objects. This guide takes you from installation to a well-dressed store in about thirty minutes.
Set up Vale in ten minutes: logo, colors, fonts, menus, homepage, product page, filters, newsletter, markets, social links and a going-live checklist, step by step.
Install the theme
- Add Vale to your store. On the Theme Store listing, choose the preset you like and select Try theme or Buy theme. Vale is added to Online Store > Themes as an unpublished theme.
- Preview before publishing. Select Customize to open the theme editor. Your products, collections and pages appear straight away; nothing changes on your live store until you publish.
- Publish when you are ready. From Online Store > Themes, open the menu next to Vale and select Publish.
Each preset installs with its own colors, fonts and home page. You can switch later in Theme settings, but starting from the preset closest to your brand saves the most time.
The two presets
- Vale
- Beige ground, Inter with Bodoni Moda accents and IBM Plex Mono labels. Opens with the editorial cover hero.
- Still
- Near-black ground with beige type and Roboto Mono labels, with beige bands for the shop sections. Opens with the full-bleed photo hero with an index.
Compare the presets in detail.
Your first thirty minutes
1. Menus
In Content > Menus (or Online Store > Navigation), edit the main-menu. Vale's header ships with two Mega menu blocks, for top-level items named Shop and Collections. Give those items submenus that link to collections, and each collection appears as a picture tile automatically.
- Main menu
- Shop (Furniture, Lighting, Objects…), Collections (rooms or edits), Journal, About
- Footer menu
footer: Shipping, Returns, Care, Contact, Accessibility- Mega menu items
- The block's "Menu item" must match the menu item's name exactly
Read Mega menu and search for hand-picked promo tiles and search quick links.
2. Logo and favicon
In Theme settings > Logo & favicon, upload a logo (landscape or portrait both work; adjust Logo width). Without a logo, your store name is set in the grotesk with a small bronze dot (turn off Show the dot after a text logo if you prefer). Add a favicon: square, at least 192 × 192px.
3. Colors
Theme settings > Colors holds five color schemes. Every section has a Color scheme setting, so you can alternate grounds down a page. In the Vale preset:
- Scheme 1 · Background 1
- The page ground. In Vale: beige
#E9E1D3, text#1C1813 - Scheme 2 · Background 2
- Heroes and alternate bands. In Vale: sand
#DFD2BB - Scheme 3 · Background 3
- Reading, product details and drawers. In Vale: ivory
#F4EFE6 - Scheme 4 · Contrast
- The inverse of the ground: evening sections, search, mobile menu. In Vale: near-black
#15130F - Scheme 5 · Accent
- Callouts and the sale badge. In Vale: bronze
#7A5531
The editor lists them as Scheme 1 to Scheme 5; the roles above stay the same in every preset, only the colors change. In Still, where the ground is dark, Scheme 4 is the light band, so its announcement bar, footer, search panel and mobile menu use Scheme 2. Also set the Page color scheme (the ground behind every section), Drawers and pop-ups and, under Animations, the Curtain color scheme for page transitions.
4. Fonts
Theme settings > Typography has three font pickers: Body and heading font (body, headings, navigation, buttons), Accent serif font (rationed to display moments: italic captions, sign-offs, large words) and Label font (uppercase labels, counters, specification rows). Wrap labels in parentheses shows eyebrows as (Selected pieces).
5. Collection templates
Vale includes four collection templates. Assign one per collection in the admin (Products > Collections > a collection > Theme template):
- Default collection
- Grid with a split image banner
- collection.editorial
- Magazine spread: every seventh piece large, with editorial tiles
- collection.catalogue
- A catalog or price list with materials and details
- collection.gallery
- Large plates with minimal captions
Shoppers can still switch the view if Let shoppers switch the view is on. See Collections and filters.
6. Product information
The product template shows a spec table, document downloads, a rating and materials when the product has the right metafields. Create these definitions in Settings > Custom data > Products:
- custom.material
- List of single line text: materials, shown in the catalog list view
- specs.*
- One single line text field per row, for example
specs.dimensions,specs.lead_time - custom.downloads
- List of files: spec sheets, care guides, CAD files
- reviews.rating
- Rating, with
reviews.rating_count(integer)
Then, in the theme editor on a product, set the Spec table block's Metafield namespace to specs. Full details in Product page.
7. Pages
Create your pages in Online Store > Pages and assign the matching template: page.about for your story, page.contact for the contact form, page.accessibility for an accessibility statement, page.faq for common questions, page.showroom for a visit-us page and page.lookbook for a shoppable lookbook. Products can use product.minimal or product.story. Everything else can use the default page template.
Updates
When a new version of Vale is released, Shopify shows it on your Themes page. If you have not edited the theme's code, it can update automatically; otherwise you get an unpublished copy with your settings carried over. Read the changelog before updating.