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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Автор

Команда almazweb.company

Поделиться

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

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

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

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

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

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

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