Плагины WordPress для адаптации сайта под мобильные устройства

Я человек компьютерный, большие лопаты телефонов мне вообще не нравятся, поэтому сидеть в Интернете с телефона не мой вариант. И, создавая сайты, первое время я  не подумала о том, что в большинстве то случаев люди сейчас наоборот сидят в Интернете с мобильных устройств.

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

Итак, представляю вам 7 разных вариантов как адаптировать ваш сайт на WordPress под мобильные устройства с помощью плагинов. Установка их бесплатна и займет у вас всего пару минут, а пользователи перестанут плеваться от ненависти, увеличивая и разворачивая ваш сайт на своих телефонах.

HAMMY

Очень удобны плагин Hammy для изменения размеров изображений в соответствии с разрешением экрана мобильного устройства, на котором будет выводиться сайт. Он заменяет тег <img> на <figure>, а также использует код изображения версии WordPress 3.5 для изменения размера изображения.

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

RESPONSIVE WIDGETS

Этот плагин предлагает новые текстовые/HTML виджеты WordPress, доступные только на гаджетах типа iPad, Nook, PlayStation Vita и других общих устройствах – планшетах и смартфонах. У многих виджетов в WordPress есть чекбоксы, с помощью которых можно настроить выведение виджетов на конкретных устройствах. Например, если вы хотите выводить виджет только на планшетах, но не на iPad, то отметьте галочкой нужный чекбокс.

WP LIGHTBOX2

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

Чтобы использовать плагин, необходимо просто его активировать. В нем есть несколько настроек, но можно не трогать ничего, так как дополнительной настройки он не требует.

RESPONSIBLE

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

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

WPTOUCH MOBILE PLUGIN

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

Однако, стоит быть внимательным! В июле 2014 года стало известно об уязвимости версии плагина WPTouch 3. Она была тут же замечена и исправлена, но успела навредить многим сайтам, которые использовали данный плагин. Поэтому всегда следите за обновлениями плагина и заботьтесь о безопасности вашего сайта во всех его версиях.

WORDPRESS MOBILE PACK

Второй лидер тем для мобильной версии сайтов на WordPress. Его популярность обосновано в замене им классического дизайна на интерфейс мобильного приложения.

Как и предыдущий плагин WPTouch, этот нуждается только в установке и активации. При желании можете покопаться в настройках, но это необязательно. Плагин можно использовать сразу же после его активации.

JETPACK

Этот плагин занимает лидирующие позиции по популярности среди подобных ему инструментов, это подтверждается поддержкой WordPress.com и Automattic. В нем есть очень полезная функция «Mobile Theme». Чтобы использовать ее, нужно зайти на страницу настроек (Jetpack → Settings) после установки и активации плагина. Действий минимум, а возможностей максимум. Но не используйте данный плагин с плагином Disqus, так как они не очень совместимы.