Использование настроек дизайна формы подписки

Настройки дизайна Bloom допускают практически неограниченное количество вариантов, адаптированных к вашему сайту.

Bloom позволяет вам настраивать все

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

Заголовок и сообщение

Здесь вы можете настроить текстовое содержимое, отображаемое в вашей подписке.

Заголовок

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

Сообщение 

Этот текст появится под вашим заголовком с меньшим размером шрифта.

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

Настройки изображения

Здесь вы можете добавить изображение к своей форме, а также настроить, где это изображение будет отображаться.

Ориентация изображения

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

URL изображения

Это URL-адрес изображения, которое вы хотите использовать. Вы можете ввести собственный URL-адрес статического онлайн-ресурса или нажать кнопку «Загрузить изображение», чтобы загрузить собственное изображение для использования в форме.

Анимация загрузки изображения

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

Скрыть изображение на мобильном устройстве

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

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

Стиль формы

Эти настройки дизайна влияют на всю форму подписки и состоят из набора общих стилей для вашей формы.

Фоновый цвет

Изменит цвет фона формы.

Шрифт заголовка

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

Шрифт сообщения

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

Цвет текста

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

Стиль углов

Здесь вы можете выбрать стиль уголка формы. Если выбрать закругленные углы, закругленные углы будут применены к внешним краям формы.

Рамка 

Здесь вы можете добавить рамку к своей форме. Эту границу можно применить ко всем 4 кромкам или к отдельным кромкам.

Цвет границы

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

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

Стиль рамки

Если вы выбрали рамку, вы можете настроить стиль здесь. В дополнение к настройке цвета в предыдущем разделе вы также можете настроить форму рамки.

Сплошная

Это самый простой стиль рамки, который создает сплошную тонкую рамку по краю формы.

Пунктирная

Пунктирная граница образует пунктирную линию по внешнему краю.

Двойная обводка

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

Внутри рамки

Создает сплошную обводку, однако, в отличие от «сплошной» рамки, эта рамка помещается внутри поля формы, а не на внешнем крае.

Письмо

Создает более игривую рамку, имитирующую классическое письмо.

Настройка формы

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

Ориентация формы

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

Текст электронной почты

Регулирует слова-заполнители, используемые в форме ввода электронной почты.

Текст кнопки

Вы можете настроить текст, отображаемый на кнопке отправки.

Цвет текста кнопки

Здесь вы можете настроить цвет текста, используемого в кнопке отправки.

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

Стиль формы

Эти настройки применяются к полям внутри формы.

Ориентация поля формы

Регулирует способ отображения полей ввода в самой форме. Вы можете выбрать, чтобы поля ввода отображались «встроенными» в одну строку, или расположить поля друг над другом.

Стиль углов полей формы

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

Цвет текста формы

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

Цвет фона формы

Этот параметр позволяет изменить цвет фона формы. 

Цвет кнопки формы

Здесь вы можете настроить цвет кнопки отправки.

Вот пример двух разных форм, для которых были изменены настройки. У одного составные поля, а у другого — встроенные. 

Стиль кромки формы

Настройте край, отделяющий форму от текстового содержимого.

Текст нижнего колонтитула, сообщение об успешной отправке и настраиваемый CSS

Эти настройки дают вам дополнительный контроль над сообщениями, которые появляются во время отправки формы, а также возможность добавлять собственные настройки CSS в отдельные формы.

Текст нижнего колонтитула формы

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

Сообщение об успехе

Это сообщение появляется после того, как посетитель успешно подписался на рассылку.

Пользовательские CSS

Здесь вы можете добавить собственный CSS, который будет применяться только к создаваемой вами форме.