Skip to main content

Site Builder overview

Site Builder is the DigiTrade tool implementers use to assemble and publish a client's storefront.

N
Written by Niyaz

Site Builder is the DigiTrade tool implementers use to assemble and publish a client's storefront across its structural layers. Open Site Builder from the DigiTrade Hub with an active client selected because the selected client scopes the pages, menus, and top bars you manage. Site Builder determines presentation and composition, but it does not own business rules, identity policy, data authority, integration, or localization truth.

Client pages screen listing storefront pages by navigation menu.

Site Builder areas

The main navigation includes Client pages, Menus, Top bars, index.html Settings, and Templates. These areas manage storefront pages, navigation menus, top bars, root HTML configuration, and reusable storefront starting points. A Sync button appears on every Site Builder screen and pushes the current build to the storefront when selected.

Client pages

Client pages is the primary workspace for the client's storefront pages and organizes them by navigation menu using tabs. The built-in tabs are Main Menu, Hidden, and Profile. Each additional menu you create appears as a tab, so you can identify the menu associated with a page and reorder pages within that menu. A page record has four tabs: Details, Page Editor, Sidebar Left, and Sidebar Right. Details holds page configuration settings, Page Editor provides the page layout canvas, and the two sidebar tabs configure optional side panels beside the main content area. The Page Editor hosts a drag-and-drop canvas where you place and configure widgets interactively. The page editor toolbar includes sidebar toggles, undo and redo controls, viewport controls, zoom controls, and an Edit control. The Edit control opens page-level style settings.

Menus

Menus defines the navigation structures that organize storefront pages. A menu has a Name and a Translation key, and menus created here become tabs on Client pages. Adding a menu creates a new page group, and the Groups tab in a menu record lists the groups belonging to that menu. Menu groups organize sections within a navigation menu. The SHOP_* translation keys for menus, groups, and pages are defined and translated in the Localization tool rather than in Site Builder.

Top bars

Top bars are persistent storefront regions that frame views, such as an application bar or footer. A top bar record provides Details and Editor tabs. The Editor tab provides a visual canvas for composing the top bar layout with toolbar controls shared by the page editor.

Index.html settings

index.html Settings is a single-record configuration for the root HTML file from which the storefront is delivered. The configuration accepts custom script content and can attach a media asset. Each client has one index.html record.

Templates

Templates provides pre-built storefront starting points for implementers who want an initial structure instead of a blank canvas. The available template options are Fashion, Electronics, and Beauty. Applying a template places its page structure, menu configuration, and top-bar layout on the current client. Applying a template replaces existing configuration, so use it at the start of an engagement or when intentionally rebuilding from scratch.

How the parts connect

Menus define page groupings, client pages are assigned to those menus and carry their layouts, top bars frame pages, and index.html configuration wraps the storefront at the delivery layer. Templates can pre-populate these layers together, after which implementers can customize the resulting storefront structure. When the build is ready, Sync on any screen pushes the assembled build to the live storefront. Site Builder composes the experience but cannot create business meaning, permissions, or external completion beyond the capability a component invokes.

Related

Did this answer your question?