Help4 Builder Guide
Help4 Builder Guide
This guide walks your team through designing pages with Help4 Visual Builder so what you build in the editor matches what visitors see on the live site.
1. Start a Page
- Create or open a page.
- Choose Help4 Builder mode.
- Click Open Visual Builder for full-screen editing.
2. Build Structure First
- Add Section or Inner Section blocks first.
- Set column/flex/grid layout, gap, and container width.
- Then drop content widgets into those columns.
3. Edit Elements
- Click an element in live preview to open its popup settings.
- Use grouped tabs: content, style, spacing, and advanced controls.
- Use media pickers (not raw URLs) for images/video whenever possible.
4. Responsive Workflow
- Switch viewports (desktop/tablet/mobile/large displays).
- Set per-device spacing and typography where needed.
- Keep layouts clean to avoid overflow and clipping.
5. Save, Preview, Publish
- Save layout in builder.
- Preview frontend and verify pixel parity.
- Publish only after checking key breakpoints.