Width and spacing
Section width controls the outer composition. Page width aligns content with the store layout; Full width uses the available area; Custom width exposes its percentage control where offered. A separate Content width limits the content inside that area. Desktop and mobile padding, card gaps and spacer blocks are different controls; inspect neighboring sections before adding more empty space.
Background images and contrast
- Choose the section background image where that control is available. Content images inside cards or blocks are separate from a section-wide background.
- Choose image position, using Image focal point where offered. Set the source image’s focal point in the image editor before relying on that option.
- Choose Scroll with section or Fixed to viewport when available. Fixed changes the background scrolling treatment; it does not make the content section itself sticky. Preview the actual mobile browser rather than relying on a desktop simulation alone.
- Adjust the overlay and color scheme so headings, links and form responses remain readable. Sections with their own background system, such as Promo banner and Countdown, have their own corresponding controls.
Prepare useful media
- There is no one required resolution for every module. As starting recommendations, use roughly 2000–2400 px-wide large banners, 1000–1600 px card images and consistent square product originals around 1600–2000 px when using a square presentation. These are recommendations, not upload limits.
- Choose source proportions that match the actual tile or ratio. Cover can crop the image; Contain can leave space around the full image. A focal point or crop position cannot restore detail from a low-resolution original.
- Use a separately composed mobile image only where the module offers that control. General section background controls do not automatically imply a separate mobile-image picker.
- Keep essential copy and buttons as editable content. Supply useful alt text for meaningful images and choose a relevant cover for video.
Visibility and anchors
Hide on desktop and Hide on mobile affect where the section appears. Check the correct device preview before diagnosing missing content. When Section anchor is available, use a short unique name and link to it with a #fragment; avoid assigning the same anchor to several sections.
Resources, defaults and real content
Product, Collection, Article, Page and Menu controls select resources in the current store; the theme does not create those records when you add a section. Editor placeholders can appear when resources are missing. Default text, statistics, delivery claims, prices in manual copy and policy examples must be reviewed for your store. The full control references describe base schema defaults; a chosen preset can provide a different initial configuration.
Preview before saving
- Start with an unpublished theme copy and actual content.
- Review desktop and phone layout, including long headings and missing-image cases.
- Open links and keyboard controls; check sliders, tabs and hotspot panels without relying only on hover.
- Plan any real form, cart or account test deliberately. A layout preview does not prove email delivery or checkout eligibility.