← Назад
Обзор функций
FAQ

Блочная секция

Сложность ∙ Легко

Аудит вашего сайта или консультация по редактору

Аудит вашего сайта или консультация по редактору

0₽

0₽

подключенного тарифа для конструктор сайтов

подключенного тарифа для конструктор сайтов

+4

+4

месяца

месяца

промокод на продвижение в сетях Яндекс

промокод на продвижение в сетях Яндекс

+12.000₽

+12.000₽

тарифа чат-ботов, автоворонок и мобильных приложений

тарифа чат-ботов, автоворонок и мобильных приложений

+3

+3

Бесплатный домен в зоне .ru/.рф

0₽

0₽

Бесплатный шаблон сайта под вашу сферу бизнеса

Бесплатный шаблон сайта под вашу сферу бизнеса

0₽

0₽

месяца

месяца

/год

/год

Забронировать предложение

Получите подарки от mottor при подключении тарифа

Получите подарки от mottor при подключении тарифа

спецпредложение

I. Общие принципы работы в секции

В отличие от свободной секции, здесь блоки размещаются друг под другом вертикально:
  • Разместить блок справа или слева от другого блока можно с помощью "Колонок":
Появится вот такой блок с тремя столбцами:
  • С помощью кнопок "+" можно создать до 10 столбцов:
Нажав на иконку корзины, вы сможете удалить один из столбцов. Удалить можно только пустой столбец.
  • После настройки количества столбцов, поместите нужные блоки в них:
С помощью границ между столбцами вы сможете управлять шириной колонок:
Внутри столбцов можно размещать другие блоки "Колонки" для дополнительного разделения:
Нажав на кнопку шестеренки в меню блока, вы сможете зайти в его настройки:
В них вы сможете настроить отступы, заливку фона, обводку, тень, и скругление углов для столбцов.

В разделе "Список столбцов" можно быстро поменять порядок столбцов в колонках, не перенося блоки по одному:
  • Если нужно добавить отступ в определенном месте, это можно сделать с помощью блока "Разделитель":
Потяните за его нижнюю границу, чтобы настроить размер отступа:
В настройках блока вы можете вручную вписать высоту и включить отображение черты:
  • Блок "Группа" позволит вам объединить несколько других блоков для более удобного переноса или создания однородной карточки с фоном:
  • Зайдите в настройки "Группы", здесь вы сможете задать цвет блока для выделения на общем фоне сайта:
  • C помощью опции "Сделать свободной" вы сможете конвертировать блочную секцию в свободную:

II. Настройки блочной секции

  • Дважды кликните по свободному месту в секции, чтобы открыть ее настройки:
Здесь имеется 3 окна параметров, рассмотрим их по очереди:

1. Фон

Здесь вы сможете установить один из 6 типов фона секции и включить эффект наложения цвета поверх него:
  • Пустой — на секции устанавливается прозрачный фон. На сайте он выглядит белым, так как "под сайтом" находится подложка из белого цвета.
  • Цвет — с помощью него вы сможете установить статичную заливку фона одним цветом, либо градиентом из нескольких цветов:
  • Картинка — здесь можно загрузить статичное изображение в качестве фона:
У этого типа заливки есть дополнительные параметры:

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

Эффекты фона — позволяет включить один из трех эффектов:

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

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

Позиция — позволяет выбрать угол экрана, от которого начинает показ фона секции.

Видео — здесь можно установить в качестве фона секции видео-ролик, загруженный в сервис Youtube.

В поле "Видео с Youtube" вставьте ссылку на ролик, полученную с помощью кнопки "поделиться":

  • Слайдер — позволяет установить несколько изображений, которые автоматически сменяются с заданным промежутком времени.

  • Карта — позволяет установить в качестве фона секции карту. Отлично подходит для секций в подвале сайта.

    Укажите адрес в поле ниже и нажмите на кнопку "Поиск":

В самом низу окна настройки фона находится опция "Наложение цвета"

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

2. Границы

Опция позволяет настроить переходы между секциями:

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

Эффект "Наложение цвета" или фоновое изображение / видео / слайдер / карта при этом учтен быть не может.

3. Отступы

Этот параметр позволяет настроить отступ между верхней/нижней границей секции и контентом в ней.

Вы также можете изменить их, просто потянув за рамки сверху и снизу секции:

Часто задаваемые вопросы:

1. Как исправить положение блоков в мобильной версии?

Мы подробно описали процесс настройки мобильной версии в инструкции.

2. Почему видео на фоне секции отображается в таком низком качестве?

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

3. Почему видеофон запускается на сайте с задержкой?

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

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

Рекомендуется для этого использовать видео до 25 секунд - стандарт для видеофонов в интернете.

4. Как перенести готовую секцию на другую страницу или сайт?

На этот вопрос мы подробно ответили в инструкции.

5. Какой оптимальный размер изображения для фона "Слайдер"?

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

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

Для ПК рекомендуем разрешение 1920*1080.
На мобильных фон "Слайдер" мы использовать не рекомендуем. Лучше создать копию секции и разместить на фоне одну статичную картинку.

Если что-то будет непонятно — в конструкторе сайтов mottor есть бесплатная техподдержка для всех пользователей. Вам поможет живой специалист:

— в чате на сайте lpmotor.ru
— по телефону 8 800 200 51 47 (звонки по РФ бесплатные)
— в Телеграм: https://t.me/lpmotorchat

Ищете конструктор чтобы собрать сайт или интернет-магазин?
Попробуйте mottor бесплатно
шаблон сайта доставки еды
шаблон интернет-магазина
шаблон интернет-магазина
шаблон-квиз строительство
шаблон сайта по ремонтуо
450+ шаблонов
ждут вас
Бесплатный конструктор сайта
Все шаблоны
Шаблон онлайн курс
Шаблон курс инвестиций
Шаблон доставка еды
Шаблон онлайн школа
Шаблон для портфолио
Шаблон лендинг вебинара
Шаблон интернет-магазин мебели
Одностраничный сайт
Многостраничный сайт
Создать сайт онлайн бесплатно самому
Создать квиз
Создать сайт бесплатно конструктор
Создать бесплатно интернет магазин
Создать сайт конструктор
Конструктор сайта онлайн
Онлайн конструктор сайта бесплатно
Конструктор интернет магазинов
Конструктор страниц
Сайт конструктор бесплатно
Конструктор создания сайтов
бесплатный конструктор сайтов, лендингов и квизов
Документы:
Полезные ссылки:
Функциональность:
Функциональность:
О компании:
при поддержке Фонда Развития Интернет Инициатив
бесплатный конструктор сайтов, лендингов и квизов
Бесплатный звонок по России
Шаблоны:
Популярные запросы:
support@lpmotor.ru
О компании и сервисе
Тур по сервису
Блог
Инструкции
Договор-оферта
Партнёрская программа
Шаблоны
Видеоинструкции
Согласие
Тарифы и услуги
Обновления
Политика конфиденциальности
Сделано на mottor
Техподдержка
Платная поддержка
Инструкция по установке