Add a Section
Find a section in the library, filter layouts, and insert it at the correct position without confusing library insertion with AI generation.
Add a section when the page needs another block, such as testimonials, pricing, or a final call to action. The normal Design Editor uses the section library, then lets you customize the inserted layout and content.
At a Glance
| Control | What it does | Important distinction |
|---|---|---|
| Page Add Section | Adds at the page insertion point | Library insertion |
| Add Section Above / Add Section Below | Inserts next to a selected block | Exact position |
| Search | Finds section categories or layouts | Not an AI prompt field |
| Sections / Global | Browses ordinary or global section categories | Not saved version history |
| Design agent | Handles an explicit AI request | Review scope and permissions |
Choose the Insertion Point
Choose the page
Insert beside an existing section
Check the panel
Browse and Search the Library
Use Search in the initial library view to narrow the section categories. Sections shows the ordinary library and Global shows the global section choices. Select a category to open its layout choices in Content.
| Library stage | Control | What it searches or changes |
|---|---|---|
| Section list | Search | Section categories |
| Layout list | Search | Layouts for the selected section category |
| Layout list | Filter menu | Narrows compatible layout choices |
| Layout list | Sort choice | Changes the layout ordering |
| Layout card | Select | Inserts the chosen layout |
| Content header | Back arrow | Returns to the category list |
If a search returns no suitable layout, clear it before choosing another category. Filtering does not rewrite a section or generate a layout from your search text.
Insert and Customize
Pick a section category
Select a layout
Review the new block
Use Sections to replace the layout later or Text Editing to refine its message.
What AI Can Actually Do Here
The customer-facing Add Section library does not expose a free-form section brief field or a Generate Copy button. Those controls are not wired as an available insertion workflow. Search finds existing library content; it does not generate it.
Use the Design agent for AI-assisted section addition and copy requests. State the target page, desired position, and the purpose of the new section. Treat the prompt as a request for the agent's supported tools, not a guarantee that every custom layout can be built.
Add a testimonials section to the Home page, below Features and above the final call to action.
Use an available testimonial layout that matches the current site style.
Do not invent customer names or quotes. Leave clear placeholders for verified testimonials.
On the Services page, add an FAQ section below Pricing.
Use an available FAQ layout and draft five questions about onboarding, turnaround time,
monthly reporting, cancellation, and support. Do not change other pages.
Rewrite the copy in the new Home page call-to-action section.
Invite visitors to book a 20-minute consultation. Keep the layout and image unchanged.
Do not claim a discount or guarantee.
Library Versus Internal Studio
An internal Studio route has an AI section workflow for staff and an admin conversion/review workflow. These are not customer-facing AI tabs in the normal project Design Editor. Do not look for a JSX upload or React converter in your project's Add Section panel.
The old Saved library tab and Save Component action are hidden. Global components are not the same as a personal saved-section library.