Дизайн страницы

Чтобы приступить к дизайну страницы регистрации, перейдите в Редактор внешнего вида. В него можно попасть из списка Страниц регистрации по кнопке Внешний вид 

Страницы регистрации - внешний вид

или из Настроек страницы регистрации → раздел Дизайн подписной страницы → кнопка Открыть визуальный редактор.

 

Для начала предлагается настроить форму регистрации.

Для формы регистрации можно:

  • Выбрать один из двух цветов - красный или синий. Цветными будут рамка вокруг формы и кнопка призыва к действию.
  • В полях Заголовок формы, Подзаголовок формы и Текст кнопки призыва задать текст на этих элементах внутри формы.
    Допустимая длина текста для Заголовка и Подзаголовка - 64 символа.
    Если поле Подзаголовок оставить пустым, то по умолчанию будет отображаться текст КОЛИЧЕСТВО МЕСТ ОГРАНИЧЕНО. Если вы не хотите вводить свой подзаголовок, но хотите убрать сообщение об ограничении мест, введите в данное поле символ пробела.  

Заполните поле Текст кнопки, вызывающей форму, если планируете разместить кнопку на странице.

Вверх

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

При этом внешний вид (стиль) может изменяться. Для выбора стиля страницы, нажмите на кнопку названия стиля — «Простой», «Бокс1», «Бокс2», «Аэро1».
Структура страницы регистрации

Редактируемые блоки окружены пунктирной линией. При наведении курсора пунктирная линия подсвечивается другим цветом (на скриншоте выше — блок «Подзаголовок») .

Для изменения блока просто щелкните внутри него — появится «плавающая» панель редактора.

Плавающий редактор

Для выхода из режима редактирования щелкните за пределами редактируемых блоков.

В правой части шаблона страницы расположен блок из трех полей. Среднее поле по умолчанию используется для формы регистрации и в него уже вставлен шорткод [CTA_FORM]

Если из поля для формы регистрации удалить шорткод [CTA_FORM] и оставить его пустым, форма регистрации всё-равно будет отображаться в странице. Чтобы форма не отображалась, введите в поле несколько пробелов и сохраните изменения. 

На странице может отображаться обычная форма подписки или же кнопка, по клику на которой открывается форма подписки. Чтобы вместо формы отображалась кнопка, вызывающая форму, используйте шорткод [CTA_BUTTON]. Шорткоды добавляются через пункт редактора Вставить.

Шорткоды [CTA_FORM] и [CTA_BUTTON] можно вставить в любом месте страницы.

Вверх

Вставка изображений

Используйте изображения, загруженные в Облако Бизона. 

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

2. Чтобы вставить картинку в любой другой блок, установите курсор в нужное место и нажмите на кнопку Загрузка изображений/выбор

В обоих случаях откроется окно Облака сервиса. Загрузите картинку в Облако, если не сделали этого заранее, выберите её и нажмите кнопку Использовать / Вставить на страницу.

 

Чтобы использовать картинки, размещенные на других ресурсах, в панели редактора выберите пункт Вставить Image или просто нажмите на пиктограмму изображения.

В открывшемся окне в поле Источник укажите ссылку на файл с изображением.

В ссылке должен быть указан файл с изображением (jpg, png и т.д.) Например, https://сайт/картинка.jpg

Подсказка, как добавить изображение с Google Disk.

Нажмите, чтобы развернуть
В ссылке на файл с Google Disk отсутствует прямое указание на формат файла. Чтобы ссылка сработала, её нужно немного изменить.

Пример: Открыли доступ к файлу и скопировали ссылку. Ссылка имеет вид — https://drive.google.com/file/d/1Kgn9esoJVTuVDG/view?usp=share_link
Заменяем весь текст между https://drive.google.com/ и 1Kgn9esoJVTuVDG на uc?id= и удаляем всё, что после 1Kgn9esoJVTuVDG.

Должна получиться ссылка вида: https://drive.google.com/uc?id=1Kgn9esoJVTuVDG
Данную ссылку вставляем в поле Источник

Обращаем внимание, что идентификатор файла 1Kgn9esoJVTuVDG  дан для примера, у вас он будет другим.  

Вверх

Кнопка Произвольный HTML-код открывает дополнительное поле, в котором можно ввести свой HTML/CSS код.

Обратите внимание, что при добавлении пользовательского кода администрация сервиса не несет ответственности за работоспособность страницы регистрации. Перед использованием страницы проверьте, что код ничего "не ломает".


После завершения всех изменений, сохранитесь, нажав на
Сохранить изменения.

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

Вверх

Ознакомьтесь с возможностями конструктора страницы регистрации для создания продающей страницы в видео-инструкции:

Другие разделы: