Перейти к основному содержимому

Формы оформления заказа

Формы оформления заказа — это простой и гибкий способ экспериментировать с разными подходами при попытке конвертировать новых клиентов.

Ultimate Multisite 2.0 предлагает редактор форм оформления заказа, который позволяет создавать столько форм, сколько нужно, с разными полями, предлагаемыми продуктами и т. д.

Чтобы получить доступ к этой функции, перейдите в меню форм оформления заказа на левой боковой панели.

Список форм оформления заказа

На этой странице вы можете увидеть все имеющиеся у вас формы оформления заказа.

Таблица списка включает столбец Статус, чтобы вы могли проверить, доступна ли каждая форма в данный момент клиентам:

СтатусЗначение
АктивнаФорму можно использовать везде, где опубликован ее шорткод или страница регистрации.
НеактивнаФорма сохранена, но отключена. Клиенты не смогут завершить оформление заказа с ее помощью, пока вы снова ее не включите.

Используйте столбец статуса перед редактированием публичного регистрационного потока, особенно если вы храните черновые или сезонные формы оформления заказа вместе с действующими формами.

Если вы хотите создать новую форму, просто нажмите «Добавить форму оформления заказа» в верхней части страницы.

Вы можете выбрать один из этих трех вариантов в качестве отправной точки: один шаг, несколько шагов или пустая форма. Затем нажмите, чтобы перейти в редактор.

Когда вы выбираете один шаг или несколько шагов в качестве отправной точки, шаблон формы теперь по умолчанию включает поле Выбор шаблона. Это поле позволяет вашим клиентам выбрать шаблон сайта в процессе регистрации. Вы можете оставить его на месте, удалить или переместить, как любое другое поле в редакторе.

Редактор формы оформления заказа

Кроме того, вы можете редактировать или дублировать уже имеющиеся формы, нажимая на параметры под их названием. Там же вы найдете параметры для копирования шорткода формы или удаления формы.

Действия при наведении на форму оформления заказа

Обзор редактора формы оформления заказа

Редактор формы оформления заказа предоставляет комплексный интерфейс для создания ваших регистрационных форм. Ниже приведен обзор структуры редактора:

Обзор редактора формы оформления заказа

Редактирование формы оформления заказа

Вы можете создавать формы оформления заказа для разных целей. В этом примере мы будем работать с регистрационной формой.

После перехода в редактор формы оформления заказа задайте форме название (оно будет использоваться только для внутренней справки) и slug (используется, например, для создания шорткодов).

Редактор формы оформления заказа

Формы состоят из шагов и полей. Вы можете добавить новый шаг, нажав «Добавить новый шаг оформления заказа».

Добавить новый шаг оформления заказа

На первой вкладке модального окна заполните содержимое шага вашей формы. Укажите ID, название и описание. Эти элементы в основном используются внутренне.

Вкладка содержимого шага формы оформления заказа

Далее настройте видимость шага. Вы можете выбрать между «Всегда показывать», «Показывать только вошедшим пользователям» или «Показывать только гостям».

Вкладка видимости шага формы оформления заказа

Наконец, настройте стиль шага. Эти поля необязательны.

Вкладка стиля шага формы оформления заказа

Теперь пора добавить поля в наш первый шаг. Просто нажмите «Добавить новое поле» и выберите нужный тип раздела.

Шаг формы оформления заказа с полями

У каждого поля есть разные параметры для заполнения. Для этого первого ввода мы выберем поле «Имя пользователя».

Выпадающий список выбора типа поля

Настройки содержимого поля имени пользователя

Настройки видимости поля имени пользователя

Настройки стиля поля имени пользователя

Вы можете добавить столько шагов и полей, сколько нужно. Чтобы отобразить ваши продукты и дать клиентам возможность выбрать один из них, используйте поле «Таблица цен». Если вы хотите дать своим клиентам возможность выбрать шаблон, добавьте поле «Выбор шаблона». И так далее.

Диалог добавления нового поля

Примечание: имя пользователя, email, пароль, название сайта, URL сайта, сводка заказа, оплата и кнопка отправки являются обязательными полями для создания формы оформления заказа.

Пока вы работаете над формой оформления заказа, вы всегда можете использовать кнопку предварительного просмотра, чтобы увидеть, как ваши клиенты увидят форму. Вы также можете переключаться между просмотром от имени существующего пользователя или посетителя

Кнопка предварительного просмотра формы оформления заказа

Модальное окно предварительного просмотра формы оформления заказа

Наконец, в расширенных параметрах вы можете настроить сообщение для страницы «Спасибо», добавить фрагменты кода для отслеживания конверсий, добавить пользовательский CSS в форму оформления заказа или ограничить ее определенными странами.

Расширенные параметры

Вы также можете вручную включить или отключить форму оформления заказа, переключив этот параметр в правом столбце, или безвозвратно удалить форму.

Переключатель активности

Чтобы удалить форму, нажмите параметр удаления в действиях формы:

Параметр удаления формы оформления заказа

Не забудьте сохранить форму оформления заказа!

Кнопка сохранения

Чтобы получить шорткод вашей формы, нажмите «Сгенерировать шорткод» и скопируйте результат, показанный в модальном окне.

Кнопка сохранения с шорткодом

Поле таблицы цен

Поле Таблица цен отображает ваши продукты в форме оформления заказа, чтобы клиенты могли выбрать план. При редактировании этого поля вы можете настроить несколько параметров:

Настройки поля таблицы цен

Вот как таблица цен отображается во frontend регистрационной форме:

Таблица цен оформления заказа на фронтенде

  • Продукты: Выберите, какие продукты отображать и в каком порядке они будут показаны.
  • Принудительно разные длительности: Когда включено, показываются все продукты независимо от того, есть ли у них соответствующая вариация цены для текущего выбранного расчетного периода. Когда отключено (по умолчанию), продукты без вариации для выбранного периода скрываются. Опция принудительных длительностей таблицы цен
  • Скрывать при предварительном выборе: Скрывает таблицу цен, когда план уже был выбран через URL (например, /register/premium).
  • Шаблон таблицы цен: Выберите визуальный шаблон для таблицы цен (простой список, устаревший и т. д.).

Если вы добавляете продукт в таблицу цен до того, как форма включает поля, необходимые для завершения процесса оформления заказа этого продукта, редактор теперь показывает предупреждение. Используйте предупреждение, чтобы добавить отсутствующее обязательное поле перед публикацией или сохранением изменений для рабочей формы регистрации.

Добавление переключателя выбора периода

Если вы настроили вариации цен для своих продуктов (например, месячные и годовые цены), вы можете добавить поле Выбор периода в форму оформления заказа. Это поле отображает переключатель, который позволяет клиентам переключаться между расчетными периодами, а таблица цен динамически обновляется в реальном времени.

Шаг 1: Настройте вариации цен для своих продуктов

Перед добавлением поля выбора периода убедитесь, что для ваших продуктов настроены вариации цен. Перейдите в Ultimate Multisite > Продукты, отредактируйте продукт и откройте вкладку Вариации цен, чтобы добавить альтернативные расчетные периоды (например, годовой со скидкой).

Вкладка вариаций цен у продукта

Шаг 2: Добавьте поле выбора периода в форму оформления заказа

  1. Перейдите в Ultimate Multisite > Формы оформления заказа и отредактируйте свою форму оформления заказа.

  2. Прокрутите вниз до шага, который содержит поле Таблица цен, и нажмите Добавить новое поле.

  3. В диалоге выбора типа поля нажмите Выбор периода.

Диалог добавления нового поля с выбором периода

  1. Настройте варианты периода. Для каждого варианта требуется:

    • Длительность: Число (например, 1)
    • Единица длительности: Тип периода (дни, недели, месяцы или годы)
    • Метка: Текст, который увидят клиенты (например, "Ежемесячно", "Ежегодно")
  2. Нажмите + Добавить вариант, чтобы добавить больше вариантов периода. Эти варианты должны соответствовать вариациям цен, которые вы настроили для своих продуктов.

Настройки поля выбора периода

  1. Выберите Шаблон переключателя периода (Clean используется по умолчанию и выводит простой стилизованный переключатель, готовый для пользовательского CSS).

  2. Нажмите Сохранить поле.

Шаг 3: Разместите поле над таблицей цен

Для лучшего пользовательского опыта убедитесь, что поле выбора периода отображается перед полем таблицы цен на шаге оформления заказа. Вы можете перетаскивать поля, чтобы менять их порядок в редакторе формы оформления заказа. Так клиенты сначала выбирают расчетный период, а затем видят цены для этого периода.

Редактор формы оформления заказа с порядком полей

Как это работает на фронтенде

После настройки клиенты, посещающие вашу страницу регистрации, увидят переключатель периода над таблицей цен. Когда они нажимают другой расчетный период:

  • Таблица цен мгновенно обновляется и показывает цены для выбранного периода (перезагрузка страницы не требуется).
  • Если Принудительно разные длительности отключено в поле таблицы цен, продукты без вариации цены для выбранного периода будут скрыты.
  • Если Принудительно разные длительности включено, все продукты остаются видимыми, даже если у них нет вариации для выбранного периода (они покажут свою цену по умолчанию).

Предварительный выбор расчетного периода через URL

Вы также можете предварительно выбрать продукт и расчетный период через URL. Ultimate Multisite поддерживает эти шаблоны URL:

  • /register/premium — Предварительно выбирает только продукт "Premium"
  • /register/premium/12 — Предварительно выбирает продукт и длительность 12 месяцев
  • /register/premium/1/year — Предварительно выбирает продукт с длительностью 1 год

Поле выбора шаблона

Поле Выбор шаблона позволяет клиентам выбрать шаблон сайта во время оформления заказа. Теперь оно включено по умолчанию в шаблоны форм оформления заказа с одним шагом и с несколькими шагами, добавленные в Ultimate Multisite v2.6.1.

Добавление поля вручную

Если вы работаете с формой, созданной до v2.6.1, или начали с пустого шаблона:

  1. Перейдите в Ultimate Multisite > Формы оформления заказа и отредактируйте свою форму оформления заказа.
  2. На шаге, где собираются сведения о сайте, нажмите Добавить новое поле.
  3. Выберите Выбор шаблона в диалоге типа поля.
  4. Настройте поле:
    • Метка — Заголовок, который клиенты видят над сеткой шаблонов (например, "Выберите шаблон сайта").
    • Обязательное — Должны ли клиенты выбрать шаблон перед продолжением.

Как это работает

Когда клиент выбирает шаблон во время оформления заказа, Ultimate Multisite использует его при создании нового сайта. Показанные шаблоны берутся из вашего списка Шаблоны сайтов (Ultimate Multisite > Шаблоны сайтов). Здесь отображаются только шаблоны, отмеченные как доступные для клиентов.

Базовые домены форм оформления заказа

Ultimate Multisite v2.13.0 рассматривает домены, настроенные в полях URL сайта формы оформления заказа, как базовые домены сети. Используйте настройки доступных доменов этого поля, когда хотите, чтобы клиенты создавали сайты в одном или нескольких общих доменах регистрации, таких как example.com и sites.example.com.

Общие базовые домены формы оформления заказа не считаются сопоставлениями пользовательских доменов для отдельных сайтов. Когда клиент создаёт сайт в подкаталоге на одной из таких баз, Ultimate Multisite не создаёт запись сопоставленного домена, из-за которой общий хост принадлежал бы только этому одному сайту. Общий хост остаётся доступным для соседних сайтов, которые используют ту же базу формы оформления заказа.

Используйте пользовательские домены для сопоставленных хостов отдельных клиентов, например customer-example.com. Используйте базовые домены формы оформления заказа для общих хостов регистрации, которые могут использовать многие сайты.

Удаление поля

Если вы не предлагаете шаблоны сайтов, удалите поле выбора шаблона из вашей формы. После этого клиенты получат тот шаблон по умолчанию, который настроен в Ultimate Multisite > Settings > Site Templates.