
PageBuilder
Визуальный конструктор секций для MODX 3: черновик и публикация без перезаписи content ресурса
- MODX 3
- PHP 8.2
- Vue 3


Секция newsletter рисует HTML-форму. Отправка идёт на внешний action_url, не через FetchIt.
action_url обязателен. email_name задаёт имя поля email в POST. note это текст про персональные данные.

| Параметр | Значение |
|---|---|
| key | newsletter |
| Слой | Pro |
| Категория | конверсия (conversion) |
| Chunk | pagebuilderpro_newsletter |
| Требования | pro |
| Поле | Тип | Обязательно | Назначение |
|---|---|---|---|
title | text | нет | Заголовок |
text | textarea | нет | Текст |
action_url | url | да | URL обработчика формы |
email_name | text | нет | Имя поля email |
placeholder | text | нет | Placeholder |
submit_label | text | нет | Подпись кнопки |
note | textarea | нет | Примечание о данных |
Форма method="post" уходит на action_url. FetchIt не участвует. Пустые поля получают значения chunk: имя поля email, кнопка Subscribe, placeholder you@example.com. note и text печатаются только если заполнены. Отдельного empty state нет: без action_url публикация не проходит, поле обязательное.
{
"title": "Рассылка",
"text": "Раз в месяц",
"action_url": "https://example.com/subscribe",
"email_name": "email",
"placeholder": "you@example.com",
"submit_label": "Subscribe",
"note": "Можно отписаться в письме"
}Fenom chunk pagebuilderpro_newsletter:
{set $emailField = $email_name|default:'email'}
{set $submitText = $submit_label|default:'Subscribe'}
{set $ph = $placeholder|default:'you@example.com'}
<section class="pb-section pb-section--newsletter pb-newsletter{if $cssClass} {$cssClass|escape}{/if}" data-pb-section="newsletter"{if $id} id="pb-{$id|escape}"{/if}>
<div class="pb-section__inner">
{if $title}<h2 class="pb-heading">{$title|escape}</h2>{/if}
{if $text}<p class="pb-newsletter__text">{$text|escape}</p>{/if}
<form class="pb-newsletter__form" method="post" action="{$action_url|escape}">
<label class="pb-newsletter__label" for="pb-newsletter-{$id|escape}">
<span class="pb-sr-only">Email</span>
<input
class="pb-newsletter__input"
id="pb-newsletter-{$id|escape}"
type="email"
name="{$emailField|escape}"
placeholder="{$ph|escape}"
required
autocomplete="email"
/>
</label>
<button class="pb-button" type="submit">{$submitText|escape}</button>
</form>
{if $note}<p class="pb-newsletter__note">{$note|escape}</p>{/if}
</div>
</section>emailsender