Set up Bayform.

2. Add catalogue data

Use Shopify’s product editor or import a reviewed product CSV. Check prices, measurements, availability and fulfillment data before publishing. Upload your images and assign exact variant images separately.

Create product metafield definitions under namespace custom, following metafield-definitions.json. This is a setup specification, not a Shopify API import payload. Map values from your catalog mapping.

Measurements are product-level. If variants have materially different dimensions, use separate products or extend the data model before launch. A finish image is not a measured manufacturing drawing.

3. Set identity and navigation

In theme settings, choose paper/ink/accent/plane colors and their foreground colors. Choose heading and body fonts with Shopify’s font picker. Upload a favicon. In the header, choose a logo, descriptor and main menu. Logo images retain their aspect ratio.

Create menu links for your home page, an all-pieces collection, materials page and /pages/your-room. Create that page with template page.your-room; create a materials page using page.materials. In Theme settings → Room planning, choose that page. An existing published your-room page is used automatically when no page is selected; otherwise room links open the home page. You can select a different page handle without changing theme code. Configure footer menus and leave unused social URLs empty.

Choose colors with sufficient text contrast. The supplied default pairs pass the local contrast calculation; merchant-selected colors still need checking. Keep long menu labels concise for shoppers even though wrapping is supported.

4. Compose a room study

Add the Room atlas section. Set its heading, description, reference photograph and nominal room width/depth. Add up to eight Study piece blocks and select real products. Set each block’s left/top position in centimetres and orientation. Those settings define the “Use this study” arrangement. A room photograph is editorial; the plan uses the numerical product dimensions.

Study placement starts only when the shopper’s saved room is empty. It will not overwrite an existing selection. Room controls permit a 120–1200 cm rectangular room. Shoppers can name the room, change dimensions, move a footprint, rotate it by 90 degrees, alter quantities, export a JSON file and print the sheet.

5. Configure the piece register

On desktop, the default collection is a measured object field with role-specific outer W × D envelopes at a common scale. Select an outline to open its photograph and audition inspector. Photographic index offers an alternative; without JavaScript the photographic catalogue remains available.

Native Shopify filters, sorting and pagination still use your real catalogue. Width screening applies only to currently loaded products; unknown widths remain visible. The cm/in control changes display labels, while data entry and coordinates stay in centimetres. Product dimensions are not silently treated as precise manufacturing plans.

6. Arrange the product sheet

The default block sequence is identity, price, media, purchase, dimensions and description. Wide screens combine the photograph, temporary room audition and native purchase configuration. Product blocks remain merchant-reorderable.

Choose a new spot or a saved line to replace. The candidate and previous outline show together with placed width/depth and quantity-aware price differences. Change X/Y and orientation, then Keep or Cancel. Trying a finish or moving the candidate leaves saved-room bytes unchanged until Keep. Cancel removes the temporary overlay; restart begins another audition. Multiple product sections retain their own selected variant.

The Configure & purchase link reaches purchase controls directly on small screens. Shopify images, videos and models, app blocks, Custom Liquid, selling plans, gift recipients and native purchase remain available. Unavailable products and unsupported room quantity/plan rules cannot be kept through the audition controls.

7. Understand saved rooms and the bag

Room data stays in this browser using local storage; it is not synchronized to customer accounts or another device. Clearing browser data removes it. Export downloads an archival JSON copy; there is no room import function in this release. Print uses the browser print dialog. Browser storage failures keep the current selection in memory, so export before leaving.

One footprint is drawn per selection line. Quantities affect the estimate and cart quantity; they do not create additional footprints. The diagram does not test collisions, circulation, doors, safe clearance, installation, stacking, load or access.

Adding a room sends the chosen variant IDs and quantities to Shopify. Room name, piece reference, room dimensions, coordinates and orientation travel as line properties. The manifest reconstructs a captured drawing from private cart-line geometry and stable plan/piece/revision identifiers. Different captured plans or revisions have separate tabs. Select a numbered marker, index button or native record marker to trace the matching line. Native quantity inputs retain their original order. Browser plans can subsequently change without changing the captured reference. Older cart records without capture data remain ordinary native rows. This reference is not an installation drawing or fulfillment specification. Prices, stock, selling plans, discounts, taxes and shipping are finally determined by Shopify.

Known unavailable pieces or invalid quantity rules block batch addition until corrected. For cart updates, zero removes a line; other quantities must follow the minimum/increment/maximum shown. Shopify remains authoritative when an offer changed elsewhere.

8. Languages, media and accessibility

English is the supplied locale. Translate storefront strings using Shopify’s supported translation workflow, then review section text and product content separately. Direction is based on the locale’s base language, including ar, he, fa and ur. The Arabic-region fixture is a layout stress test with expanded strings; it is not a publishable Arabic translation.

Supply useful image alternative text and preserve the merchant image focal point. Use visible headings in order, descriptive links, labelled form fields and readable color contrast. Keyboard users can focus a room footprint, select with Enter/Space and move with arrow keys; Shift increases the movement step to 10 cm. Numeric controls provide an alternative to dragging. Final assistive-technology, touch and browser tests remain in the release checklist.

9. Troubleshooting

Product media and alternative text

Add images, hosted videos, YouTube or Vimeo videos, and 3D models in Shopify’s product editor. Assign variant images to their matching options. The product gallery preserves image proportions and provides native video controls. Videos stop when moved outside the active gallery view.

Add a useful description to each meaningful product image in Shopify. Product media use the product name when an image has no saved description. A room study photograph can use its study heading as a fallback, but a specific image description is preferable.

For 3D models, Shopify supplies the viewer and the View in your space control on supported devices. Test the actual device and model before publishing. Device AR support and accurate model scale are separate from the room planner’s entered outer dimensions.

Keyboard and resilient shopping

Use Tab and Shift+Tab to move between controls, Enter to follow links, and Escape to close the cart dialog. On a selected room footprint, arrow keys adjust the position by 1 cm; hold Shift to adjust by 10 cm. Numeric position fields provide the same placement controls.

With JavaScript disabled or the commerce script unavailable, the product form uses a native variant dropdown. Ordinary product links, cart quantity updates and removal remain the fallback shopping path. Room editing requires JavaScript. Saved room plans depend on browser storage.

Gift cards, selling plans and localization

For a gift-card product, the recipient disclosure provides the email, name, message and optional delivery date. Shopify validates and delivers gift cards; verify the recipient and delivery behavior in your store. Selling plans require a subscription app and Shopify configuration. The selected plan is included in the cart.

Configure countries, currencies and published languages in Shopify before testing the footer selectors. English storefront text is included; translations for additional languages must be supplied and checked. The theme does not install language or payment services.

Update checklist

1. Duplicate your existing theme and retain a backup.
2. Check long titles, mixed image ratios, an image-free product and empty collections.
3. Check available, sold-out and unavailable option combinations, prices and cart quantities.
4. Test app blocks, discounts, pickup, subscriptions and gift cards that your store uses.
5. Review keyboard access, text resizing and your supported devices.
6. Complete a controlled test purchase before changing the live theme.

Browsing and room planning

The Piece register starts with photographs on mobile and the shared-scale measured field on desktop. Use Browse pieces or Compare sizes to switch views. In the section settings, Initial browsing view can also keep photographs or the measured field on every screen.

The default product template places purchase configuration before the dimensions block. The dimensions block includes a native Try it in your room disclosure; the Check this piece in your room link opens it with keyboard focus. Planning is optional: customers can select a variant and add it to the bag directly. The planner keeps its open state when a finish changes.

Keep the piece commits a trial to the saved working room. Cancel leaves the saved room unchanged. The room dock appears after a piece is kept; the header room link remains available before then. Captured cart plans continue to represent the selection added to the bag.

Use the footer Logo setting to repeat your existing logo; blank uses the store name. Uploaded logo files remain merchant resources. Product blocks still follow the order you set in the theme editor.