
PageBuilder
Visual section builder for MODX 3: draft and publish without overwriting resource content
- MODX 3
- PHP 8.2
- Vue 3


Version: Pro.
A phone number, tax id, or card number is typed against a mask: extra characters are dropped as you type, not only when the page is checked before publish. The mask is set on the field (mask or a preset). The type is in PageBuilder Pro.
Plain numeric use number. Value is string with mask literals per preset.
{
"name": "phone",
"type": "imask",
"label": "Phone",
"mask": "+7 (000) 000-00-00",
"maskOptions": {
"lazy": false
},
"tab": "Content",
"width": 100,
"active": true
}Masked string.
Key phone in the section data: masked string:
{
"phone": "+7 (495) 123-45-67"
}<a href="tel:[[+phone]]">[[+phone]]</a><a href="tel:{$phone|escape:'url'}">{$phone|escape}</a>Short mask: mask. Full IMask config: maskOptions (object or JSON string).
For fields with name that are stored in the section data:
| Key | Type | Role | CMP |
|---|---|---|---|
tab | string | Group subtitle in the inspector | yes |
width | 25–100 | Field width as % of the row (flex) | yes |
description | string | Hint under the label | yes |
default | any | Initial value for a new section | yes |
active | bool | false hides the field in the inspector | yes |
required | bool | Required on publish (draft still saves) | yes |
mask or maskOptions (IMask JSON).See fields overview.