Строки и колонки в WordPress теме Алмаз

В этом уроке мы разберем сразу два элемента, элемент "Cтрока" и элемент "Колонка", эти два элемента очень похожи, разница лишь в нескольких настройках. Если вы хотите использовать полную ширину экрана, вам лучше выбрать элемент "Строка".

Для примера я создам новый блок и добавлю в него элемент "Строка".

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

Для открытия настроек элемента трока" нажмите на серый значек в левом верхнем углу элемента. Если вам нужно настроить колонку нажмите на синий кружок в правом верхнем углу элемента "Колонка". Настройки элемента "Строка", очень похожи на настройки элемента "Колонка", различие только в некоторых настройках, например у элемента "Строка" есть дополнительная настройка ширины, а у элемента "Колонка" есть настройки скругления углов.

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

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

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

Давайте перейдем во вкладку "Фильтры", здесь вы можете изменить цвета выбранного фона.

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

Переходим в соседнею вкладку "Рамка", здесь вы можете установить толщину для рамки и задать цвет.

Заходим в следующую вкладку "Тень", здесь вы можете установить тень. Выберите тень и задайте параметры тени.

С помощью третьей иконки вы сможете добавить ссылку на весь элемент "Строка". В открывшемся окне вы можете установить ссылку на любой веб адрес. В соседний вкладке "Блок" можно установить ссылку на любой блок из текущей страницу. В следующей вкладке "Popup" можно установить ссылку на всплывающее окно.

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

В этом же окне вы можете установить высоту строки и положение контента, можно разместить контент по верхнему краю, по центру, и по нижнему краю контейнера.

Если вам нужно установить отступы элемента нажмите "Больше настроек", можно настроить отступы внутри и отступы снаружи элемента.

Автор

Команда almazweb.company

Поделиться

Следующие уроки

reCAPTCHA в WordPress теме Алмаз

Как сохранить блоки для дальнейшего использования в WordPress теме Алмаз

Как использовать глобальные блоки в WordPress теме Алмаз

Меню в WordPress теме Алмаз

Наши премиум WordPress шаблоны

Наша команда almazweb.company разработала более 40+ шаблонных сайтов специально для Российского бизнеса. В каждый шаблон мы встроили инновационный конструктор страниц.