Универсальный блок (zero block)

Создание сайта с помощью универсального блока в конструкторе Salebot.pro — это быстрый и удобный способ создать профессиональный сайт без необходимости знания программирования. Не бойтесь экспериментировать, настраивать дизайн и добавлять контент, чтобы сделать свой сайт уникальным и успешным.

Универсальный блок — это полноценный редактор для веб-дизайна внутри Salebot. Он позволяет создавать уникальный дизайн блоков или всего сайта без ограничений:

Как добавить блок

Чтобы добавить универсальный блок на страницу, кликните на кнопку «+» на вновь созданной странице:

После нажатия кнопки “+” появится меню справа «Добавить новый блок».

Выбираем “Универсальный блок” и переходим к редактированию

Открывается меню настроек блока

Высота контента

С помощью этого поля можно изменить размеры блока. По умолчанию установлено значение 550рх

Пример 1. Устанавливаем значение высоты контента 750рх

Масштабирование Grid-области

Используется для адаптации дизайна сайта под различные размеры экрана

По умолчанию выключено, также можно выбрать “автомасштаб по ширине окна”.

Настройки фона

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

Можно добавить файл для фона в форматах SVG, PNG, JPG или GIF. Размер файла не должен превышать 30 мб.

Пример 1. Добавление файла в формате JPG

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

Пример 1. Отображение изображения по умолчанию в положении Центр Центр

Пример 2. Отображение изображения в положении Лево Верх

Положение “поведения” по умолчанию установлено “scroll”, можно выбрать положение “fixed”. При смене положения фон смещается.

Добавление элементов

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

Кнопка Добавить элемент создает новый слой с выбранным элементом:

Для каждого элемента открывается свое меню настроек.

После настройки элемента нажмите кнопку "Сохранить"

Текст

Можно добавить элемент с текстовым содержимым.

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

Изображение

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

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

Фон в любой момент можно изменить.

Фигура

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

Настройки фигуры:

Кнопка

Чтобы добавить кнопку, кликните "Добавить элемент" и выберите "Кнопка":

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

Чтобы кнопка была активной, необходимо добавить ссылку на нужную вам страницу в настройках элемента в разделе «Кнопка». При нажатии на кнопку будет осуществляться переход по ссылке.

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

Видео

С помощью этого инструмента можно добавить любое видео и настроить его отображение в блоке.

В универсальный блок можно добавить видео из различных ресурсов:

Для этого достаточно выбрать, где именно расположено видео (Youtube, Kinescope и пр.), а затем вставить URL в поле ссылки.

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

Далее в настройках элемента "Видео" выберите тип видео MP4:

И вставьте ссылку на видео из файлового хранилища.

Подсказка

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

Вы можете сделать подсказку полупрозрачной и разместить её поверх текста, фона или картинки:

При наведении на подсказку (на странице сайта НЕ в режиме редактирования), будет отображаться какой-либо текст:

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

Галерея

Добавить новый элемент в универсальный блок можно аналогично предыдущим:

SaleBot по умолчанию добавляет два изображения. Но вы также можете загрузить нужные для галереи изображения самостоятельно. Для этого перейдите на слой с галереей (кнопка слоя расположена слева на экране или нажмите непосредственно на изображение).

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

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

В галерее есть два варианта размера изображений: «cover» — на всю ширину изображения и «contain» — с рамками.

Пример 1. Размер изображения - «cover»

Пример 2. Размер изображения - «contain»

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

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

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

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

Аккордеон

Элемент универсального блока "Аккордеон" представляет собой удобное графическое решение для сайта в виде списка текстовых заметок с выпадающими элементами:

«Аккордеон» легко интегрировать в ваш сайт и настроить в соответствии с вашими потребностями: он может быть адаптирован под любые требования.

Чтобы добавить элемент в блок, откройте настройки универсального блока. В списке доступных элементов вы увидите «Аккордеон».

Чтобы применить к элементу нужные параметры стиля, нужно нажать на него. После этого справа появится конструктор параметров «Аккордеона», как и для других элементов универсального блока.

После того как вы нажмете на стрелку, на экране появится всплывающее окно с информацией, например, с ответом на вопрос:

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

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

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

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

В настройках “Аккордеона” вы можете добавлять еще свои вопросы, ответы и т д. Нужно нажать “Добавить”:

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

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

После завершения работы над страницей необходимо адаптировать её под различные размеры экранов.