Dynamic content blocks in SG-Builder
In short. SG-Builder has five dynamic content blocks — Form, Navigation, Products (Archive), Posts Archive, and Location Picker Button. Each one displays content that lives elsewhere in your admin. Drop the block into a Cell, open the settings panel, pick the form/menu/product query/post feed from the dropdown, and publish. The block stays current automatically whenever the source changes. Build the source content first (form, menu, products, posts, or locations), then place the block — the picker will be empty if the source doesn't exist yet.
On this page: The five blocks · Example walkthrough · Before you start · Steps · Troubleshooting
How to connect live content — forms, menus, products, posts, and locations — to any page
SG-Builder's dynamic content blocks pull live data from other parts of your SGEN site directly onto the canvas. Drop a block, open its settings panel, and pick which form, menu, product query, post loop, or location picker it shows. The block handles the rest — fetching, rendering, and keeping the output current whenever the source data changes.
What is this for?
Static blocks — text, images, buttons — hold content you type directly into the builder. Dynamic blocks hold a reference to content that lives elsewhere in your admin. Change the source and every page using that block updates automatically.
The five dynamic blocks in SG-Builder:
| Block | Pulls from | Use for |
|---|---|---|
| Form | Forms → My Forms | Contact forms, lead capture, booking requests |
| Navigation | Appearance → Menu | Site header and footer navigation menus |
| Products (Archive) | Ecommerce → Products | Browsable product grids and shop sections |
| Posts Archive | Blog / Events posts | Blog feeds, latest news, event listings |
| Location Picker Button | Locations | Multi-location stores, branch selectors |
All five are leaf components — they must sit inside a Cell at level 5 of the hierarchy (Section → Container → Row → Cell → component). Drop them onto a Cell, not onto a Section, Container, or Row.
Good use cases
Example — embed a contact form on the About page. Your site has a "Get in Touch" form built in Forms → My Forms. Drop the Form block into a Cell, open the block settings, and select "Get in Touch" from the form picker. The form renders on the public page and submits without a page reload. Submissions flow into Forms → My Forms → Submissions.
Any changes to the form in My Forms — new fields, reordered questions, updated success messaging — appear on the public page automatically. No changes needed inside SG-Builder. The same pattern applies to all five blocks. The complete flow table below shows all five at a glance.
What NOT to use this for
- Do not use the Navigation block as a substitute for the Menu Builder.
Build and manage your menus in Appearance → Menu first. The Navigation block only displays a menu you have already built there. Adding or reordering links happens in the Menu Builder, not inside SG-Builder.
- Do not use the Form block as the form builder.
Build your forms in Forms → My Forms first. The Form block embeds an existing form — it does not create or edit one. If no forms exist yet, the picker in the block settings will be empty.
- Do not use the Posts Archive block on a single-post detail template as a substitute for Post Content.
Posts Archive renders a grid or list of posts. On a post detail page, use Post Content instead — it outputs the body of the current post. For a full guide to single-post templates, see Post templates and archive pages.
- Do not use the Products (Archive) block as a substitute for a hand-picked product row.
The block queries all products (or a category filter). For a curated selection of specific products, use the ecommerce-product-card component instead — see Ecommerce storefront components.
- Do not place dynamic blocks outside a Cell.
All five blocks are leaf-level components. Dropping them onto a Section, Container, or Row produces an incorrect render or a blank canvas placeholder. Build the Section → Container → Row → Cell hierarchy first, then drop the block into the Cell.
How this connects to other features
- Forms → My Forms — build and test forms there first. Submissions from the embedded Form block appear in Forms → My Forms → Submissions.
- Appearance → Menu — all menu structure (items, sub-items, link targets) is managed in Appearance → Menu, not inside the block settings. The Navigation block only displays what the Menu Builder contains.
- Ecommerce → Products — products must be published before they appear in the Products block. Full detail: Ecommerce storefront components.
- Blog / Events — publish posts with featured images and body content before placing the Posts Archive block. Full detail: Post templates and archive pages.
- Locations — manage locations in the Locations area of your admin before placing the Location Picker Button block.
Before you start
- For the Form block: confirm at least one form exists at Forms → My Forms.
The picker will be empty if no forms have been created.
- For the Navigation block: confirm at least one menu exists at Appearance → Menu.
The picker will be empty if no menus have been built.
- For the Products block: confirm the Ecommerce module is active and at least one product is published at Ecommerce → Products.
The block renders an empty grid if no published products exist.
- For the Posts Archive block: confirm posts of the selected type are published.
Drafts and trashed posts are excluded.
- For the Location Picker Button: confirm locations are set up in the Locations area of your admin.
- Confirm the Section → Container → Row → Cell hierarchy is in place in your builder canvas before dropping any block.
All five dynamic blocks are leaf-level components that must sit inside a Cell.
Where to go
- Go to SG-Admin → Pages (or Appearance → Header / Footer for template-level blocks).
- Click the builder icon next to the page or template to open it in SG-Builder.
- Open the Blocks panel on the left side of the builder.
- Search for the block by name: "Form", "Navigation", "Products", "Posts Archive", or "Location Picker Button".
- Drag the block into a Cell in the canvas.
- Click the block to open its Settings (or Traits) panel on the right.
- Select the content to display using the dropdown picker.
Steps
1. Build the Section → Container → Row → Cell hierarchy
All five dynamic blocks are level-5 leaf components. They must sit inside a Cell within the standard layout hierarchy: Section → Container → Row → Cell → block. If the hierarchy does not exist yet, add a Section first, then a Container, then a Row, then a Cell. Drop the dynamic block into the Cell. If you drop a block onto a Row or Section directly, the builder may reject the placement or render incorrectly.
Here is the layout for a page with a Form block and a Navigation block in adjacent sections:
Section (contact section) Container Row Cell (full-width) ← Form block (select: "Get in Touch")Section (footer) Container Row Cell (full-width) ← Navigation block (select: "Footer Links")2. Drop the block and open the settings panel
Drag the block from the Blocks panel onto the target Cell. The canvas shows a placeholder for the block — a form outline, a nav placeholder, or a product grid skeleton. Click the block on the canvas to open its Settings (or Traits) panel on the right side of the builder. The settings panel for each dynamic block contains a picker dropdown as its primary option.
3. Select the content from the picker
Each dynamic block has a dropdown in its settings panel that lists available content:
- Form block — the dropdown lists every form built in Forms → My Forms.
Select the form to embed. The canvas updates to show a preview of the selected form.
- Navigation block — the dropdown lists every menu built in Appearance → Menu.
Select the menu to display.
- Products (Archive) block — no single product picker.
Configure the query: card style, items per row, limit, and optional category filter. The block queries your full published product catalog, filtered by the settings you choose.
- Posts Archive block — set the post type (blog, event, page) and configure the display options.
The full trait list for Posts Archive is covered in Post templates and archive pages.
- Location Picker Button — configure the button label and style.
The block reads your locations list automatically.
4. Configure additional settings
After selecting content, some blocks expose additional settings in the panel:
- Form block: toggle whether to show the form title above the fields.
Leave the success message blank to use the one configured on the form itself.
- Navigation block: set the layout (horizontal, vertical, or dropdown) for the menu items.
- Products block: set card style, items per row, display limit, and category filter.
- Posts Archive block: set post type, limit, order, and pagination.
Full trait reference is in Post templates and archive pages.
- Location Picker Button: set button label, style, and whether to show the selected location name after selection.
5. Save and verify on the public page
Click Publish in SG-Builder. The save confirmation flash confirms the section is live:
Open the public page in a new browser tab. Verify the dynamic block is rendering real content, not a placeholder. For the Form block: confirm the form fields appear and the submit button is active. For the Navigation block: confirm the menu links match the menu built in Appearance → Menu. For the Products block: confirm product cards with titles, prices, and images appear. For the Posts Archive block: confirm post cards with real titles and dates appear. For the Location Picker Button: confirm the button appears and clicking it opens the location selector.
The complete flow
The table below shows a full page composition using all five dynamic block types. Each block sits inside its own Cell — one block per Cell. The content is driven by the picker selection in each block's settings panel, not by anything typed into the builder.
What success looks like
- Form block: the public page shows the complete form with all fields matching the form in My Forms.
The submit button is active. After submission, the success message appears and the response shows up in Forms → My Forms → Submissions.
- Navigation block: the public page shows the correct menu items in the correct order.
Clicking a link navigates to the right page. When you update the menu in Appearance → Menu, the nav block reflects the change on the next page load.
- Products block: the public page shows a grid of product cards with real product names, prices, and images.
Adding a new product in Ecommerce → Products causes it to appear in the grid on the next page load.
- Posts Archive block: the public page shows post cards with real post titles, dates, and (where set) featured images.
Publishing a new blog post causes it to appear at the top of the feed automatically.
- Location Picker Button: the button appears in the header.
Clicking it opens the location selector. Selecting a location updates the button label to the chosen location name (if "Show selected location name" is enabled in the block settings).
What to do if it does not work
- Form picker is empty — no forms exist yet in Forms → My Forms.
Go to Forms → My Forms, create a form, and save it. Return to SG-Builder and the form will appear in the picker.
- Navigation picker is empty — no menus exist yet in Appearance → Menu.
Go to Appearance → Menu, create a menu with at least one link, and save it. Return to SG-Builder and the menu will appear in the picker.
- Form block renders blank on the public page — the selected form was deleted or unpublished in My Forms.
Go to Forms → My Forms and confirm the form is still published. If it was deleted, either restore it or select a different form in the block settings.
- Navigation block shows incorrect links — the menu structure is controlled in Appearance → Menu, not in SG-Builder.
Edit the menu items in Appearance → Menu and the block will reflect the changes automatically.
- Products block renders empty — either no published products exist, the Ecommerce module is not active, or a category filter is set to a category with no products.
Go to Ecommerce → Products and confirm at least one product has published status. Check the category filter setting in the block and clear it to show all products.
- Posts Archive block renders empty — no published posts of the selected type exist.
Go to Blog (or Events) and confirm at least one post has published status. Drafts are excluded from the block's query.
- Location Picker Button renders blank — no locations are configured.
Set up your locations in the Locations area of your admin before using this block.
- Dynamic block canvas shows only a placeholder after saving — this is expected builder behavior.
Dynamic blocks show a static preview on the canvas. The live data renders on the actual public page. Open the public URL in a new tab to see the real output.
- Block dropped onto a Section shows no output — the block landed outside a Cell.
Dynamic blocks must sit at level 5 inside a Cell. Delete the misplaced block, confirm a Cell exists in the target area, then drop the block into the Cell.
Related reading
- Post templates and archive pages in SG-Builder — full guide to Posts Archive and the single-post component family, including all trait settings.
- Ecommerce storefront components in SG-Builder — individual product-bound components, the cart button, and the mini-cart.
- Structure and layout in SG-Builder — the Section → Container → Row → Cell hierarchy that all dynamic blocks must sit inside.
- Text, headings, and buttons in SG-Builder — static leaf components that fill non-dynamic Cells alongside these blocks.
Next step
Build the source content first (Forms → My Forms / Appearance → Menu / Ecommerce → Products / Blog or Events / Locations), then place the block and publish. Verify on the public page — the builder canvas shows a static placeholder, not live data.
