Overview
Это руководство предоставляет подробный пошаговый процесс создания пользовательской контактной формы, которая отправляет данные на электронную почту администратора сайта с использованием ChronoForms8 как в Joomla, так и в WordPress. Оно охватывает установку, создание формы, настройку полей, настройку электронной почты и тестирование, а также знакомит с ChronoMails для расширенного управления электронной почтой. Следуя этим инструкциям, вы получите функциональную и профессиональную контактную форму для вашего сайта.
Добавить контактную форму в Joomla или WordPress просто с помощью ChronoForms8, универсального конструктора форм, который создает пользовательские формы с функцией отправки email. Это пошаговое руководство покажет вам, как создать контактную форму Joomla, которая отправляет данные формы на электронную почту администратора сайта, и как использовать ChronoForms8 в WordPress. Мы также представим ChronoMails, расширение для расширенного управления электронной почтой.
Для подробного обзора ChronoForms8, ознакомьтесь с этим официальным руководством.
Шаг 1: Установите ChronoForms
Убедитесь, что у вас установлен конструктор форм ChronoForms 8 для Joomla
Шаг 2: Создайте новую форму в ChronoForms 8
В менеджере форм ChronoForms8 нажмите New, чтобы создать новую форму.
- Введите название формы (например, "Контактная форма") для идентификации в админке.
- Установите уникальный псевдоним формы (например, "contact-form").
- Нажмите Save, чтобы включить функции Быстрого сохранения и Предпросмотра.
Шаг 3: Добавьте несколько полей в вашу форму
- В событии "Load" вашей страницы формы перетащите поля из окна Views справа.
- Добавьте четыре элемента: два текстовых поля (для Имени и Email), одно текстовое поле (для Сообщения) и одну Кнопку (для Отправки).
- Наведите курсор на поле Email, нажмите значок Edit, чтобы настроить его.
- Измените метку поля на "Email".
- Установите имя поля в читаемое значение, например, "email".
Совет: Используйте понятные человеку имена полей, чтобы легко извлекать данные с помощью синтаксиса шорткода ChronoForms, например{data:email}. - Добавьте два правила валидации: убедитесь, что поле не пустое и содержит действительный адрес электронной почты.
- Откройте настройки Кнопки и измените метку на "Отправить".
- Улучшите кнопку, добавив значок "paper-plane" из библиотеки бесплатных иконок Font Awesome 6.
- Настройте цвет кнопки для лучшей видимости (опционально).
Шаг 4: Настройте электронные письма контактной формы и сообщение подтверждения
- Переключитесь на событие "Submit" вашей страницы для обработки отправки формы.
- Перетащите действие Email из окна Actions в событие "Submit".
Перетащите представление Message из окна Views, чтобы отобразить сообщение "Спасибо" после отправки.
- Откройте настройки действия Email.
- Введите адрес электронной почты получателя (например, email вашего администратора).
- Установите тему письма, используя шорткод
{data:name}для включения значения поля Имя. - В теле письма используйте шорткоды, такие как
{data:field_name}для отдельных полей или{email:data_table}для форматированной таблицы всех данных формы. - (Опционально) Добавьте
{data:name}в поле Reply Name, чтобы автоматически подставлять имя отправителя в ответах. - (Опционально) Добавьте
{data:email}в поле Reply Email, чтобы автоматически подставлять email отправителя в ответах.
Шаг 5: Сохраните и протестируйте форму
- Нажмите Quick Save, чтобы сохранить вашу форму.
- Нажмите Preview, чтобы протестировать форму.
Совет: Используйте шорткоды ChronoForms, такие как {data:field_name}, чтобы динамически вставлять значения полей из событий "Load" или "Submit" той же или предыдущих страниц.
Использование ChronoForms8 для контактной формы WordPress
ChronoForms8 также совместим с WordPress, позволяя создать контактную форму с аналогичной функциональностью.
- Установите плагин ChronoForms8 для WordPress
- Активируйте плагин и перейдите в панель управления ChronoForms8 в админке WordPress.
- Следуйте тем же шагам, что и выше, чтобы создать форму, добавить поля (Имя, Email, Сообщение, Кнопка отправки) и настроить действие Email.
- Вставьте форму на страницу WordPress, используя шорткод ChronoForms8 (например,
[chronoforms8 alias="contact-form"]). - Протестируйте форму, чтобы убедиться, что она правильно отправляет письма.
Улучшение форм с помощью ChronoMails
ChronoMails, новое расширение для Joomla, улучшает функциональность электронной почты с помощью пользовательских шаблонов, логирования писем и рассылок.
Заключение
ChronoForms8 позволяет легко добавить контактную форму в Joomla или WordPress. Следуя этому руководству, вы можете создать пользовательскую форму, настроить SMTP для надежной доставки писем и изучить ChronoMails для расширенных функций. Тщательно протестируйте вашу форму и проверьте настройки DNS, чтобы убедиться, что письма доходят до адресата.
Comments: