Как добавить многостолбцовый контент в посты WordPress (HTML не требуется)

Хотите добавить многоколоночный контент в ваши посты WordPress? Колонки могут быть использованы для создания привлекательных макетов для ваших сообщений и страниц.


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

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

В этой статье мы покажем вам, как легко добавлять контент из нескольких столбцов в ваши сообщения WordPress без написания HTML-кода..

Добавить многоколоночный контент в посты и страницы WordPress

Добавление мультиколоночного контента в WordPress – простой способ

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

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

Далее необходимо выбрать блок «Столбцы», расположенный на вкладке «Элементы макета»..

Добавить блок столбцов в ваш пост WordPress

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

Блок столбцов WordPress в WordPress добавлен в запись

Как вы можете видеть на скриншоте выше, блок Columns сначала кажется пустой областью. Если вы наведите курсор мыши влево, вы увидите выделенную границу блока.

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

Столбцы Блок WordPress - 2 Колонки

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

Добавьте больше столбцов в ваши столбцы

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

Добавить текст в ваши столбцы WordPress

Добавление медиа и другого контента в ваши столбцы

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

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

Добавить новый блок в столбцах WordPress

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

Блок изображений добавлен в WordPress

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

3 колонки в посте WordPress - Предварительный просмотр

Если вы хотите добавить только изображение и текст рядом с ним, вы также можете использовать блок «Мультимедиа и текст» вместо столбцов. Этот конкретный блок сделан специально для показа мультимедиа, таких как изображения и видео, рядом с текстом.

Добавить медиа и текстовый блок в WordPress

Добавление нескольких столбцов в старом редакторе WordPress Classic

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

Сначала установите и активируйте плагин Lightweight Grid Columns. Для получения подробных инструкций, следуйте нашему пошаговому руководству о том, как установить плагин в WordPress..

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

Плагин «Добавить столбцы» Значок «Легкая сетка»

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

Например, если вы установите процент сетки рабочего стола 50%, ваш столбец покроет половину строки.

Процент ширины сетки - облегченные столбцы сетки

Существует множество вариантов установки ширины столбца от 5% до 100% с интервалом 5. Вы можете выбрать один из них, щелкнув раскрывающийся список.

Параметры ширины столбца - проценты сетки

После этого вам необходимо добавить содержимое столбца в поле «Содержимое», а затем нажать кнопку «ОК», чтобы вставить его в сообщение..

Добавление контента в вашу колонку - плагин облегченной сетки

Плагин теперь сгенерирует необходимый шорткод с вашим контентом и добавит его в ваш редактор сообщений..

Шорткод и контент добавлены в столбец WordPress

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

Шорткод и контент для 2 столбцов в WordPress

После этого вы можете сохранить свой пост и просмотреть его. Вот как это выглядело на нашем тестовом сайте с использованием темы Twenty Seventeen.

Две колонки WordPress в двадцать семнадцатой теме

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

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me