Sections

Add these in the theme editor. Image sizes are suggestions. Larger files are safe, because the theme resizes them for each screen.

Header and footer

Header. Logo, room menu and cart. Set the logo width, menu position and photo tiles. Tiles use each collection’s image (4:3, 1200 px wide or more). With “Keep header visible when scrolling” on, the header slides away as the shopper scrolls down and returns on the way up. On the home page it can sit over the hero.
Announcement bar. Up to six short messages. Set “Auto-rotate every” to rotate them.
Footer. Newsletter, menus, text blocks, a units switch, country and language selectors, social links and payment icons.

Home page sections

Room hero. A room photo in a frame with a headline, one button, an optional text link and hotspots. Each hotspot opens a spec card with the piece’s price and size and one button to the product page. Tablets get the same overlay hero as desktops, with the headline over the photo. Image: 2400 px wide or more. Add a portrait phone image if the crop needs it.
Category row. Cut-outs of products in circles, each linked to a collection. Tiles show only the name. Turn on “Show piece count” or “Show width range” to add more. Both are off by default. Up to eight categories. Images: square, 800 px.
Room switcher. One tab per room, such as Living or Bedroom. Each tab shows products from a collection.
Lookbook. Room photos with up to three pieces listed under each. A Total row closes the price column, and the “Add the whole room” button sits under it and adds them all to the cart. Photos: 3:2, 2400 px wide.
Collection series. One family of products, such as a sofa in three widths.
- Images. Best with a cut-out of the lead piece in the Cut-out setting: the piece stands in front of the series name. Works with a normal photo in the Image setting: the photo sits below the name. Put only a cut-out in the Cut-out setting. A photo there covers the name. Without an image, a placeholder drawing shows where the piece would stand.
Drawn to size. One product with dimension lines that draw as the page scrolls. It reads the product’s width, depth, height and seat height.
- Images. Best with a cut-out: the lines meet the piece’s edges exactly. Works with the product’s own photo on a plain background: the theme finds the piece in the photo. If the lines miss the piece, adjust “Piece fills image width” and “Piece fills image height”. Without an image, the piece is drawn as a box at its true proportions. Without a width, only the title and photo show.
Will it fit? The shopper enters a wall length and a doorway width, and a drawing shows whether the piece fits. Add up to four products. They are listed as a size chart, sorted by width from narrowest to widest, whatever order you pick them in. Each needs a width and a height. A depth adds the doorway check.
- Images. Best with a cut-out for each piece (the Cut-out settings): the piece stands against the wall at its true size. Works with the product’s own featured image: it fills an outline of the piece’s true size. Without an image, the outline shows on its own.
Light on linen. A close-up of fabric that the shopper lights with the pointer. Image: 3000 px wide or more. When the shopper picks a swatch, the new fabric wipes in from the chosen chip.
- Images. Best with a close, evenly lit photo of the fabric that fills the frame. Works with any photo: a swatch without its own photo shows the section photo tinted in the swatch color. Without a photo, the light falls on a plain background in the swatch color.

Making a cut-out

A cut-out is a PNG of the piece with a transparent background. Shoot the piece from the front or at a slight angle, then remove the background:

In Shopify admin, open the product image (or the image in Content, Files) and choose Edit.
Choose Remove background and save. Shopify saves a PNG.

Any other background remover also works. Crop close to the piece and keep the background transparent. A JPG cannot be a cut-out, because it has no transparency.

More sections

Material story. A close-up of fabric or wood with swatches. A swatch can swap the large photo. Image: 3000 px wide or more.
Delivery steps. Your delivery process as up to five numbered steps.
Reviews. Customer reviews with photos and ratings. App blocks also fit here.
Trade program. A band for interior designers, with a button or an inquiry form.
Featured product. One product with its details, for any page.
Custom Liquid and Custom section. For your own code and apps.

Product page

The page is a spec rail beside the photos. It runs from the title and lead line through one row per option, then Size, Seat height, Doorway and Delivery. The Size row has a small inches and centimeters switch, so the floating switch does not show on this page. The price shows once. Under it, a one-line status (“In stock”, “Pre-order”, “Sold out”) sits directly above the Add to cart button, and the Delivery row gives the timing (see Availability in the product setup guide). Below that come the Complete the room block, tabs and a trade link.

All blocks can be reordered: title, lead line, variant picker, spec row, add to cart, dimensions, collapsible tab, complete the room, trade link, and Custom Liquid and app blocks. The Rating, Disclosure and Custom note blocks are also available (see below). Older price, spec plate, delivery estimate, door-fit, swatch link and text blocks are still offered. Add one of them only if you want it, and turn off “Show price” in the Add to cart block if you add the Price block. Product images: 2400 px on the long side, 4:5.

Product page extras

Rating. Review stars and the count, read from the reviews.rating and reviews.rating_count metafields that review apps fill in. Nothing shows for a product without a rating.
Stock. No longer needed. The status line above the Add to cart button replaced the Stock spec row; a Stock row left in a template shows nothing.
Disclosure. A short legal or care notice with an icon (warning, flame, leaf or information), a heading, text and a link to the full notice. To show it only in some countries, enter two-letter codes such as US, CA. Leave the field blank to show it everywhere.
Help link. A text link, “How we measure” by default, that opens a side panel (a sheet on phones) with the text of a page you choose, or text you type into the block. Works with any page; best with a short guide under h2 subheadings. The same block can go in a Custom section.
Combined listings. On Shopify Plus, the Combined Listings app joins separate products, such as one chair per leather, into one listing. Casella shows the choice as swatches; picking one loads that product in place and updates the address. Best when each product has its own studio photo.
Custom note. A field the shopper fills in before adding to cart, such as their own material or a custom length. The note shows on the cart line and the order, under the label you set. Turn on Required to keep the piece out of the cart until the field is filled.

Room hero with several rooms

The Room hero shows its own settings as room 1. Add up to four Room blocks for more rooms, each with its own photo, headline, button and video. Hotspot blocks belong to the Room block above them in the block list. Rooms change automatically every 10 seconds (set 4 to 20 under “Time per room”, or turn “Change rooms automatically” off). A line under the active tab fills as the time runs, and a pause button sits at the end of the tabs. The count waits while a shopper hovers the hero or reads a spec card, and stops at the first touch, click or key press. On desktops a hotspot opens its card on hover; a click keeps it open. The Room film section plays a muted looping video with a poster image, and shows only the poster under reduced motion.

Content sections and blocks

Before and after compares two photos with a sliding handle drawn as a ruler. It works with any two photos and is best with two taken from the same spot, such as an empty room and the same room furnished. Recently viewed shows the pieces a shopper last opened, from their browser, and hides itself until there is something to show; it is on the product page by default and can go on collection, search, cart and page templates.

Press logos, Pull quote and Journal are home page sections. Press logos shows each publication’s quote when a shopper hovers, focuses or taps its name. Pull quote is one large customer or press line with an optional star rating. Journal shows the three newest articles of a blog.

Custom section accepts these blocks: heading, rich text, image, video, button, accordion item, divider, spacer, email signup, icon with text, columns and stack. It has presets for image with text, rich text, multicolumn and email signup. The video block loads nothing until the shopper presses Play.

Header options

The header can place the logo left or centered, put the menu on its own row, move the search icon, set a separate logo width for phones and show country and language selectors when the store sells in more than one. A Menu promo tile block adds a featured product or an image to one room’s menu; match its Menu item to the top-level link’s title. The header turns transparent on the home, product and collection pages only when a room hero is the first section.

Product cards and quick add

A product card has a small “+” button on the photo. For a product with options it opens quick add; for a product without options it adds the item to the cart. Under Theme settings, Product cards, you can switch to a full-width button, hide swatches, dimensions and badges, or turn quick add off. Badges come from badge: tags (see the product setup guide). Swatch dots change the card photo to that variant.

Quick add is a split panel on tablets and desktops: photos on the left, the spec rows, price, quantity and Add to cart on the right. On phones it is a sheet from the bottom.

Review stars on cards and on the product page (the Rating block) read the reviews.rating and reviews.rating_count metafields that review apps fill in. Nothing shows for a product without them. Turn on Browse photos on cards (Theme settings, Product cards) to let shoppers swipe a card’s first three photos. “Lift cards on hover” raises the photo 2 px on a soft shadow for mouse users; it works with any photo, cut-outs included.

Quick order sheet

Add the Quick order section to a page (template page.trade-order). It lists every variant of a collection with its size, price and a quantity stepper, and adds the lot to the cart at once. Link the page from your menu or the trade page.

Collection page

Filters, sorting, a grid of 3 or 4 columns on large screens, and an optional collection image. “Show more” adds the next page of products under the grid. Turn on Load more automatically to add it as the shopper nears the end. The button stays for keyboards. After Back from a product, the list returns to the same place. Active filters show as quiet outlined chips in one row that scrolls sideways at every width, with a “Clear all” link. The filter named in “Filter drawn as a ruler” (Width by default) is drawn as a ruler.

A switch beside Sort lets shoppers show one more card per row (or one or two on phones); the browser remembers their choice. Turn it off with “Let shoppers change cards per row”. Add up to four Tile blocks to place an editorial photo between products: choose the product it follows (1 to 24) and one or two columns. Tiles show on the first page only. They work with any photo, cropped to fill at the image’s focal point; landscape suits two columns, portrait one. Without a photo a tile shows its words on a plain panel.

Search

The search icon opens a sheet from the top (full height on phones). Suggestions list products with their sizes, collections, pages and articles, and the keyboard works with arrow keys and Enter. Before the shopper types, it shows their recently viewed pieces beside one room. Under Theme settings, Search, choose that room or collection and switch recently viewed on or off. Recently viewed is remembered in the shopper’s browser only.

Cart

A drawer and a cart page, with optional delivery notes, a discount code field and product suggestions when the cart is empty. Under Theme settings, Cart, “Currency codes” adds the code to prices ($2,450 USD): on by default in the cart, off by default on product pages. See the cart guide.

Blog, article and pages

Blog. A grid of articles with tag filters and numbered pages. Article images: 3:2, 1800 px wide.
Article. Title, date, image, text, tags, share links, previous and next links, and comments.
Page. A title and text.
Contact. A form with name, email, phone and message.
Search, 404, password and gift card. Each matches the rest of the theme.