Описание
Плагин Lightweight Grid Columns очень прост в использовании. Установите и активируйте плагин. Управление колонками доступно через визуальный редактор — просто нажмите отдельную кнопку в редакторе и задайте свои размеры колонкам (см. пример на картинках).
Укажите размеры для экрана стационарного компьютера, планшета и мобильного устройства, добавьте ваш контент, а затем вставьте шорткод на страницу.
Плагин Lightweight Grid Columns работает на основе фреймворка Unsemantic Framework: (http://unsemantic.com/)
Присоединяйтесь к GeneratePress, у нас очень много хороших тем для WordPress! (https://wordpress.org/themes/generatepress)
Плагин позволяет:
- Задавать ширину колонок для экранов стационарных компьютеров
- Задавать ширину колонок для экранов планшетов
- Задавать ширину колонок для экранов мобильных устройств
- Добавлять классы стилей к колонкам
- Добавить свои стили для вывода контента
- Создавать колонки одинаковой высоты
Скриншоты
Установка
Плагин Lightweight Grid Columns можно установить двумя способами.
- Перейдите в меню Plugins (Плагины) в раздел Add New (Добавить новый) и задайте в строке поиска название плагина Lightweight Grid Columns.
- Скачайте с официального сайта WordPress.org файл плагина с расширением zip, распакуйте архив и закачайте папку с файлами с помощью FTP-клиента на хостинг в папку
/wp-content/plugins/
.
В большинстве случаев первый способ срабатывает без проблем и он самый простой.
Часто задаваемые вопросы
- Как добавить шорткод?
-
- Убедитесь, что плагин Lightweight Grid Columns активирован.
- Во время редактирования записи или страницы, перейдите в режим визуального редактора.
- Смотрите иконку плагина (см. вкладку «Скриншоты»).
- Укажите нужную ширину для стационарного компьютера, планшета и мобильного устройства.
- Если вы добавляете последнюю в ряду колонку, поставьте галочку рядом с опцией «Last» ( «Последний»).
- Как быть, если я не могу использовать кнопку в редакторе TinyMCE?
-
Элементарно! Просто добавьте шорткод в текст контента.
Например, контент можно отображать на стационарных экранах компьютеров по 4 колонки, по 2 на планшетах и по одной на мобильных устройствах.
[lgc_column grid="25" tablet_grid="50" mobile_grid="100"]Some content[/lgc_column] [lgc_column grid="25" tablet_grid="50" mobile_grid="100"]Some content[/lgc_column] [lgc_column grid="25" tablet_grid="50" mobile_grid="100"]Some content[/lgc_column] [lgc_column grid="25" tablet_grid="50" mobile_grid="100" last="true"]Some content[/lgc_column]
Проверьте, стоит ли галочка у опции «Последний» для последней колонки. Если не стоит, поставьте и не забывайте про эту галочку)
- Какие значения в процентах можно указывать?
-
Задействовано непосредственно из (http://unsemantic.com):
При использовании плагина используются классы стилей вида grid-x, где «x» — значение ширины колонки в процентах. Значение ширины может задаваться с шагом в 5% от 5 до 100. (grid-5, grid-10 … grid-95, grid-100). Можно еще поделить страницу на три части, используя классы grid-33 и grid-66, что соответствует ширине 33.3333% и 66.6667% соответственно.
- Можно ли использовать другие опции в шорткодах плагина?
-
Да!
Вы можете:
- добавить класс
-
[lgc_column grid=»25″ tablet_grid=»50″ mobile_grid=»100″ class=»push-25″]Нужный текст[/lgc_column]
- добавить стиль
-
[lgc_column grid=»25″ tablet_grid=»50″ mobile_grid=»100″ style=»padding-left:0px;»]Нужный текст[/lgc_column]
- сделать колонки одинаковой высоты
-
По умолчанию параметр для вывода одинаковых по высоте колонок задан как «true», т.е колонки одинаковой высоты выводятся во всех случаях, пока вы сами в шорткоде не зададите опцию для отключения.
[lgc_column grid="25" tablet_grid="50" mobile_grid="100" equal_heights="true"]Some content[/lgc_column]
Отзывы
Участники и разработчики
«Lightweight Grid Columns» — проект с открытым исходным кодом. В развитие плагина внесли свой вклад следующие участники:
Участники«Lightweight Grid Columns» переведён на 7 языков. Благодарим переводчиков за их работу.
Перевести «Lightweight Grid Columns» на ваш язык.
Заинтересованы в разработке?
Посмотрите код, проверьте SVN репозиторий, или подпишитесь на журнал разработки по RSS.
Журнал изменений
1.0
- Move custom class value to the parent container
- Почищен код плагина
0.7
- Fix weird scroll behavior caused by transitions and matchHeight
- Загрузка matchHeight только на тех страницах, где используется шорткоды этого плагина.
0.6
- Исправлена ошибка из-за которой не всегда содержимое выводилось в колонках при наличии шорткода
0.5
- Move margin-bottom setting to inner element so style attribute can overwrite it
- Исправлена работа функции lgc_columns_helper чтобы устранить досадную ошибку с тегами
<p>
и<br />
внутри шорткода. - Добавлена функция jQuery matchHeight чтобы выравнивать высоту колонок для лучшей отзывчивости.
- Значительно сокращащен размер файла стилей
0.4
- Теперь иконка плагина в визуальном редакторе TinyMCE может отображаться для всех типов записей
0.3
- Исправлена ошибка, когда иконка плагина не отображалась в редакторе TinyMCE если были активны плагины SiteOrigin Page Builder и Black Studio TinyMCE Widget.
- Добавлена совместимость с Internet Explorer 7 и 8 версии
0.2
- Появилась возможность добавлять переносы строк в колонках
0.1
- Самый первый рабочий вариант плагина