Skip to main content
Site Store Pro gives you full control over how individual product pages and CMS pages are laid out, and lets you override the global background on a per-page basis. Whenever you save a setting in Global Settings, the platform updates your storefront’s visual theme automatically — you never need to rebuild assets or restart the server. This page covers the layout options you apply at the product and CMS page level.

​
Product Page Layouts

Each product has its own layout setting, giving you full control over how the image gallery, buy-box, and video player are arranged. Set the layout under Admin → Shop → Products → Edit → Layout. Site Store Pro ships with six layouts:
Layouts 3, 5, and 6 expose a Video Embed field on the product edit screen. This field accepts two formats:
  • CMS Code Embed Shortcode — reference a saved embed block by ID: [code-embed:12]
  • Raw iFrame — paste an iframe tag directly, for example: <iframe src="https://www.youtube.com/embed/VIDEOID" ...></iframe>
YouTube, Vimeo, and any other iframe-compatible source work with the raw iFrame format.

​
Choosing a Product Layout

1

Open the product editor

Navigate to Admin → Shop → Products, find your product, and click Edit.
2

Select a layout

Scroll to the Layout section and select one of the six options from the dropdown. Layouts 3, 5, and 6 reveal the Video Embed field once selected.
3

Add a video embed (Layouts 3, 5, 6 only)

Paste your CMS shortcode or raw iframe into the Video Embed field. Site Store Pro renders the player at the position defined by the layout.
4

Save and preview

Click Save, then open the product’s public URL to verify the layout looks correct at both desktop and mobile breakpoints.

​
CMS Page Layouts

Pages created under Admin → CMS → Pages support three column arrangements. Set the layout in the page editor under Admin → CMS → Pages → Edit → Layout.

Full Width

Single-column layout that spans the full content area. Best for landing pages, promotional campaigns, and long-form content that benefits from maximum horizontal space.

Left Sidebar

Two-column layout with a navigation or widget sidebar on the left and the main content area on the right. Useful for knowledge bases and category pages.

Right Sidebar

Two-column layout with the main content area on the left and a sidebar on the right. A common choice for blog posts and documentation pages.

​
Per-Page Header Banners

Every CMS page can display a full-width hero banner at the top. Set Header Banner Image in the page editor to a URL pointing to your banner image. Site Store Pro renders it as a full-width strip with the page title overlaid.
Use a banner image sized at least 1920 × 400 px to prevent upscaling artifacts on large monitors. Optimize the file with WebP format to keep load times fast.

​
Per-Page Background Media

In addition to the global background set in Admin → Global Settings, each CMS page accepts its own background overrides. Site Store Pro resolves backgrounds using the following priority order — the highest-priority source that has a value wins:
1

Priority 1 — Per-page background video

Set a Background Video URL on the page. When present, this overrides everything else: the global background and any per-page image.
2

Priority 2 — Per-page background image

Set a Per-Page Background Image on the page. This overrides the global background setting but is itself overridden by a per-page video.
3

Priority 3 — Global background

The background mode and media configured under Admin → Global Settings apply as the site-wide default whenever no per-page override is set.
The glassmorphism dark overlay settings (overlay tint and opacity) defined in Global Settings apply on top of whichever background source is active, including per-page images and videos. Adjust the overlay opacity if text legibility changes after setting a page-specific background.