Табличная вёрстка в Вордпресс — дело не лёгкое, особенно если используется адаптивная тема. Существует множество плагинов, позволяющих расположить контент в виде нескольких колонок или столбцов.
Рассмотрим простой плагин под названием WEN’s Responsive Column Layout Shortcodes, который позволит нам легко и просто представить имеющийся текст на страницах и в отдельных записях в виде таблицы с определённым количеством колонок.
Установка и настройка плагина
Устанавливается это дополнение точно также как и любое другое. После установки активируем и начинаем настройку. Однако настроек у WEN’s Responsive Column Layout Shortcodes вообще нет — можно сразу перейти к форматированию контента.
Разбиваем контент на несколько столбцов
Как уже было сказано, настроек никаких нет. В редактор встраивается специальный значок, при нажатии на который появляется специальное меню. Рассмотрим подробнее:
- Допустим, нам нужно расположить текст в несколько столбцов в какой-либо определённой записи. Открываем эту запись и нажимаем на специальный значок в редакторе:
- Появляется всплывающее диалоговое окно с одной формой для ввода. В эту форму следует вписать количество колонок, которое мы хотим видеть. Максимальное число столбцов контента — 6:
- После этого, в поле ввода текста записи появляется следующий код:
[bscolumns class="one_fifth"]Your Content Goes here[/bscolumns][bscolumns class="one_fifth"]Your Content Goes here[/bscolumns][bscolumns class="one_fifth"]Your Content Goes here[/bscolumns][bscolumns class="one_fifth"]Your Content Goes here[/bscolumns][bscolumns class="one_fifth_last"]Your Content Goes here[/bscolumns][bscolumns class="clear"][/bscolumns]
- В коде, вместо «Your Content Goes here» вписываем свой текст, вставляем картинки и прочее, что должно быть в каждом отдельном столбце. Картинки автоматически будут отредактированы — их размер будет «подстраиваться» под ширину колонок.
- В результате мы получим контент в виде таблицы:
Плагин WEN’s Responsive Column Layout Shortcodes доступен на официальном сайте разработчиков: http://wordpress.org/plugins/wens-responsive-column-layout-shortcodes/
