Dynamic Builder User Guide
The Dynamic Builder is a powerful visual page-building module for GeniXCMS, powered by GrapesJS. It allows you to create complex, responsive layouts and interactive components using a simple drag-and-drop interface.
Activating the Module
Before using the Dynamic Builder, you must ensure the module is active:
- Navigate to Modules > Manage Modules in the sidebar.
- Locate Page Dynamic Builder in the list.
- Click the Enable button (the lightbulb icon) if it's currently disabled.
- Once active, the builder's features will be integrated into your page management workflow.
Accessing the Builder
The Dynamic Builder is integrated directly into the GeniXCMS Page management system:
- Go to Pages > Add New (or edit an existing page).
- Scroll to the bottom of the page form.
- You will see a blue card labeled "Design with Dynamic Builder".
- Click the Launch Visual Editor button to open the full-screen design interface.
lightbulbTipUse the builder for complex landing pages, while the standard editor remains ideal for simple blog posts or text-heavy content.
Working with Blocks
Standard Sections
These are the building blocks of your page, including:
- Hero Sections: Premium landing page headers like the "Hero Cyber Frontier".
- Team Sections: Showcase your leadership with interactive grids and hover effects.
- Content Blocks: Lead paragraphs, material icons, and section wrappers.
Interactive Widgets
Modules with dynamic behavior:
- Testimonial Carousel: A multi-column slider for customer reviews with customizable column counts.
- Counter Row: Animated numbers that count up as they scroll into view.
- Accordion/FAQ: Collapsible sections for frequently asked questions.
Saving Your Work
Once you are satisfied with your design, click the Synchronize Layout (Save) button in the top right corner. This will sync the generated HTML and CSS back to the main GeniXCMS editor as a single block of content.
infoNoteThe Dynamic Builder acts as a high-level layout tool. Once the content is synchronized back to the main CMS, it is treated as a standard content block.
Tips for Best Results
- Grid First: Always start with a Grid or Row component to establish a solid responsive layout.
- Layers Panel: Use the Layers panel on the left to navigate complex nested structures easily.
- Breadcrumbs: Use the breadcrumb trail at the bottom of the canvas to select parent containers (like columns or rows) specifically.
