Page Builder

The Page Builder is a full-featured post meta box layout editor used to compose complex page sections, rows, columns and widgets.

Key concepts

• Section → Rows → Columns → Widgets (hierarchy)
• Nested rows: supported but limited to one level deep
• Widgets contain widget_values as a JSON string and are rendered via shortcodes on the frontend

Where to look in the codebase

• Admin mount & data injection: admin/meta-box-contents.php
• Editor React app root: admin/assets/js/src/page-builder/PageBuilder.jsx
• All Page Builder state + actions: admin/assets/js/src/page-builder/stores/usePageBuilderStore.js
• Widget type registry: admin/assets/js/src/page-builder/config/widgetTypes.js
• Column layout definitions: admin/assets/js/src/page-builder/config/columnLayouts.js
• Meta box PHP (save/load): admin/class-sanil-website-builder-admin.php
• Frontend rendering for shortcodes: public/class-sanil-website-builder-public.php

Data storage

• Post meta key: sanilwb_data (hidden input page-builder-data in the meta box)
• Structure rules: a column holds either widgets or nested_row, never both. Nested rows max one level.

Developer notes

• To add a new widget type: update widgetTypes.js, add dialog tabs, and implement frontend shortcode handler in public/class-sanil-website-builder-public.php.
• Responsive fields are saved with suffixes: __tablet, __mobile.