Editor 2.0 — Platform Overview

Editor 2.0 — Platform Overview

Effective Date: February 1, 2026   Last Updated: February 1, 2026

Overview

All Hibu One websites are built using Duda’s Editor 2.0. It provides the canvas, structural tools, content elements, and styling controls that shape how pages are designed, organized, and displayed across all devices. The editor includes the core components teams work with every day: Sections, Columns, Inner Columns, Widgets, Breakpoints, the Design Panel, the Layers Panel, Themes, and system-controlled areas such as headers and footers.

Definition

Editor 2.0 is a component-based website-building experience that brings layout structure, visual design settings, connected data, and responsive controls into a single editing environment. It organizes content using a clear hierarchy, applies theme-driven styling, and ensures that every element behaves predictably across Desktop, Tablet, and Mobile.

Purpose / Why It Matters

Editor 2.0 defines the foundation for how Hibu One websites are created, structured, and maintained. A clear understanding of the editor supports:

• Consistent design patterns across all Smart Sites
• Predictable responsive behavior at each breakpoint
• Efficient builds using templates and reusable structures
• Fewer layout or alignment issues during and after launch
• Accurate use of connected data and theme settings
• Proper handling of locked, system-controlled elements
• Strong, stable performance and long-term maintainability

Shared understanding of the editor ensures Design, Build, QA, Support, Copy, and Product teams work within the same framework and deliver a consistent, high-quality site experience.

Structure & Layout

• Sections define major horizontal regions; Columns and Inner Columns define layout structure; Widgets are the building blocks of all content.
• Layout changes made at the Desktop breakpoint cascade downward unless overridden at smaller breakpoints.
• Manual spacing (e.g., empty widgets used for spacing) is prohibited; approved padding and margin tools must be used.
  

Breakpoints

• Editor 2.0 uses three breakpoints: Desktop, Tablet, and Mobile.
• Content changes (adding/removing widgets, editing text, replacing images) apply to all breakpoints.
• Layout changes (alignment, spacing, size, visibility) may be set per breakpoint but must maintain overall design integrity.
  

Theme & Global Controls

• Theme Colors and Theme Text define global styling defaults.
• All elements should use theme-driven styles unless a rule explicitly specifies an override.
• Color and font consistency must be preserved across all site pages.
  

Connected Data

• Business Info, Business Text, Business Images, and Collections must be used when applicable.
• Pages requiring dynamic or repeatable content must reference connected data to ensure consistency and scalability.
  

System-Locked Areas

• Headers and Footers cannot be replaced or structurally modified.
• Breadcrumbs follow established rules for placement, visibility, and styling.
  

Additional Sections

Key Concepts

• Sections: Structural containers that define vertical stacking of major content regions.
• Columns & Inner Columns: Layout containers that organize content horizontally and vertically.
• Widgets: Individual pieces of content or functionality (text, image, button, form, list, layout element).
• Design Panel: Styling controls for spacing, alignment, backgrounds, borders, layout, and responsive adjustments.
• Layers Panel: A hierarchical map of all content on the page—critical for troubleshooting layout issues.
• Floating Menu: Quick-access actions for editing, rearranging, duplicating, or configuring individual elements.
• Themes: Centralized system controlling global colors and typography.
  

What Editor 2.0 Is Not

• It is not a custom-code environment.
• It is not an open, freeform layout tool—structure and hierarchy must be maintained.
• It is not a direct HTML/CSS editing platform; such changes are restricted and controlled.