Контакты

Как сделать мобильную версию шаблона для WordPress. Как сделать мобильную версию блога на WordPress? Wordpress мобильный плагин

Мобильные WordPress темы в последнее время стали весьма популярны. И это вполне объяснимо, так как технологии не стоят на месте. Многие пользователи сменяют свой десктоп на более компактные и современные мобильные устройства IPADS, iPhone, смартфоны и другие навороченные «таблетки». Требования к современным веб-сайтам расширились. Сайт (блог) должен выглядеть идеально независимо от того, с помощью стационарного компьютера или мобильного устройства пользователь заходит на него.

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

Почему именно Вордпресс? WordPress является самой доминирующей CMS, и недавно созданные темы требуют адаптации под мобильные устройства, другими словами любая WordPress тема должна хорошо смотреться на любом устройстве в т.ч. и мобильном.
Этот вопрос можно решить благодаря плодотворной работе многих WordPress разработчиков, разработавших мобильные темы WordPress и плагины. Благодаря их усилиям, вы можете легко создать свой ​​собственный мобильный WordPress сайт или же модифицировать имеющийся, добавив свежий дизайн и много других современных примочек.

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

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

Разделы статьи

Список Мобильных WordPress Тем

TOUCH Light Mobile WP Theme

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

BRAVE – A Dark Responsive Mobile Theme

Судя по отзывам, многим нравится эта тема. Она имеет чистый дизайн. Особенности: установка Web App, галереи, возможность выбора несколько цветов и т.д.

Ultimate And Slate Mobile WordPress

Этот пакет состоит из двух популярных мобильных темы Utimate и Slate. У них есть много вариантов показа галереи, разнообразные шаблоны страниц и тонны другие не менее полезные функции.

HERO Mobile Theme And Web App

Это мощная тема и мне очень нравится функция, которая позволяет посетителям добавлять значок веб-приложение (web app) на своем iPhone. Мобильная версия будет идеально работать вместе с Вашей WordPress темой. Простой дизайн и много полезных функций.

Resans WP Mobile Portfolio Theme

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

Spartan WP Theme For Mobile

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

Provocateur WordPress Theme For Mobile Devices

Provocateur — Вордпресс тема для мобильных устройств в использованием JQuery Mobile, HTML5 и CSS3 технологий. Выглядит идеально на мобильных устройствах.

Troller Mobile WordPress Theme

Это тема имеет чистый дизайн и легка в использовании. Мобильная Вордпресс Тема имеет красивый ретро / винтажный вид.

Mobit Mobile WordPress Template

Mobit — хорошая мобильная тема с большим количеством страниц и возможности индивидуальной настройки.

Metro Mobile WordPress Mobile Theme

Метро полностью резиновая с Bootstrap 2.1, созданная с помощью HTML5 и CSS3. Она имеет полезные функции, имеет 13 бесплатных приложений. 24 цветная цветовая гамма, а также Контактный формуляр, 7 Плагинов и несколько фото галерей и т.д.

Tiger Mobile Template WordPress Version

Тигр — WordPress тема для мобильных устройств с Retina дисплеем, созданная на базе HTML5. Она имеет различные готовые страницы и множество других удивительных особенностей.

Mobilize – jQuery Mobile WordPress Theme

Mobilize (с анг. Мобилизация)- является мобильной Вордпресс темой с широким набором функций. Домашняя страница имеет сенсорный слайдер, социальные иконки, галереи, контактную форму, блог с картинками и лучшими видео, много коротких кодов (шоткодов) и много других наворотов.

Аль Капоне, Миша Япончик или ребята из Острых Козырьков примерно 100 лет назад вряд ли задавались вопросом что такое мобильная версия сайта wordpress. Скорее всего, их интересовала мобильная версия ограбления.

В наши дни для доблестных воинов интернета часто приходится решать подобные задания.

Коль вы столкнулись с такой задачей, уважаемый читатель, то давайте же рассмотрим варианты решений.

Мобильная версия сайта wordpress — как сделать свой сайт адаптивным

Мобильный сайт — какой должен быть?

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

Мобильная версия сайта wordpress — что такое мобильный сайт?

Адаптивная верстка

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

Будь то Ipod, Iphone, Android или телевизор Samsung, ваш сайт должен выглядеть опрятным везде и всегда.

Мобильная версия сайта wordpress — адаптивная верстка

Адаптивный дизайн

Судя по всему, адаптивный дизайн сайта относится к факторам первостепенной важности.

Ведь в 2018 году мало кому будет приятно зайти в своем телефоне на какой-то сайт и увидеть там микроскопическую картинку вместо приемлемого стандартами размеров шрифтов информативно полезного текста.

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

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

Адаптивный дизайн — Мобильная версия сайта wordpress

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

Этот вопрос был хитом еще, наверное, лет 5 назад. Сейчас адаптировать сайт, особенно на WordPress, не сможет только полный профан.

Для этого, всего-то-навсего, нужно зайти на пару-тройку сайтов и получить исчерпывающие ответы из статей и видео.

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

Как сделать мобильную версию сайта

Давайте начнем по порядку.

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

Наверняка, они знают свое дело на приличном уровне.

Мобильная версия сайта wordpress — как сделать

Мобильная версия Яндекс и Вконтакте

Рассмотрите внимательно эти сайты:

мобильная версия вк — https://m.vk.com

мобильная версия яндекс — https://mobile.yandex.ru

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

Вконтакте и Яндекс — Мобильные версии

Проверить мобильную версию сайта

Оптимизирована ли ваша страница для мобильных устройств?

Google Search Console

  • Google Search Console Test Mobile Friendly
    https://search.google.com/test/mobile-friendly

Яндекс Вебмастер

  • Яндекс Вебмастер
    https://webmaster.yandex.ru/

Bing Mobile Test

  • Bing Mobile Test
    https://www.bing.com/webmaster/tools/mobile-friendliness

ВебМарк

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

  • ВебМарк
    http://webmark.com.ua/mobile/

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

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

Поэтому проверять мобильную версию сайта желательно постоянно. Особенно при внесении правок в код и установке новых функциональных модулей.

Сервисы для проверки мобильной версии сайта

Мобильная версия сайта для wordpress

Мобильная версия сайта предлагается практически в каждой теме wordpress.

Разработчики шаблонов заинтересованы предоставить качаственный дизайн с заранее адаптированным интерфейсом под все мобильные и десктопные устройства.

А если самописная или древняя тема, то мобильную версию WordPress можно организовать так:

Плагин

Используйте популярные и с постоянной адекватной поддержкой плагины.

Среди них могу выделить Jetpack и WPtouch.

Видео об этих 2-х плагинах смотрите ниже.

Без плагина

Если решили сделать без плагина, то отлично. Профессиональный подход.
Добавьте в файл стилей несколько незамысловатых строк медиа-запросов (типа, @media screen and (max-width: 768px){…}), и будет вам счастье.

Или подключите свой mystyle.css в файле шаблона и спокойно контролируйте адаптивность через FTP.

Только не забывайте учитывать моменты обновлений движка WordPress.

Как поступить лучше, — вам виднее.

На поддомене

Можно сделать на поддомене отдельную быструю легкую версию сайта.

Мобильная версия сайта для wordpress — варианты

Настройка мобильной версии сайта

WordPress

В WordPress адаптация настроена со старта.

О, мой уважаемый читатель!

Разработчики WordPress понимают, как никто иной, что нужно всегда следовать в ногу со временем.

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

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

Сегодня, как говориться, — в Вордпресс все включено.

Не скрою, что под личные нужды иногда приходится подправить код.

Мобильная версия сайта wordpress — как настроить

Jetpack настройка мобильной версии

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

Ответ по настройке можно найти в следующем плейлисте:

Мобильная версия сайта wordpress — плагин Jetpack

Woocommerce мобильная версия

Обычно, Woocommerce сам автоматически подстраивается под текущую тему WordPess, которая должна быть адаптивной.

Но если у вас какие-то свои интересы по мобильности Woocommerce, тогда взгляните на следующий плейлист:

  • Скачать Woocommerce 3.4.3 zip по прямой ссылке с https://ru.wordpress.org

Мобильная версия сайта wordpress — woocommerce

Wptouch

Пожалуй, самый популярный плагин для реализации мобильной версии сайта на WordPress — плагин WPtouch.

В следующей подборке видео дан обзор, рассмотрена установка и настройка плагина WPtouch.

Мобильная версия сайта wordpress — плагин WPtouch

WordPress мобильная версия на поддомене

На поддомене мобильную версию делают, как правило, крупные сайты — социальные сети, интернет-гипермаркеты, веб-порталы, поисковые системы. Им выгодно разделять мобильный и основной функционалы, так как из-за того, что основной код сайта огромный, мобильный модуль они размещают независимо на поддомене или в подкаталоге.

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

Для среднестатистического сайта на WordPress с головой хватает обычного хорошо настроенного адаптивного шаблона.

А если у вас wordpress-сайт с посещаемостью 20 000 или более человек в сутки, то вы бы врядли чиали эти строки.

Мобильная версия сайта wordpress на поддомене

Как отключить мобильную версию сайта wordpress

Такой вопрос иногда проскакивает тоже.

Ну… Смысл отключить?.. Взять и отключить. Как включали, так и отключите.

Или скажите тому, кто включал. Он все отключит.

И зачем тогда было настраивать…

Да и вообще — странный вопрос. Почему то таких аж 15 раз в месяц фигурирует в вордстате.

Может не нужно было и затрагивать?..

Мобильная версия сайта wordpress — как отключить?

Программа для создания мобильной версии сайта Adobe Muse

Adobe Muse — удивительная разработка корпорации Adobe для создания сайтов любой сложности и любого назнаения.

В этом видео рассмотрено создание мобильной версии сайта в программе Adobe Muse.

Мобильная версия сайта — программа Adobe Muse

Если у вас Не WordPress

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

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

На этом завершаю.

Удачных событий и свершений.

И, как всегда, — задавайте побольше правильных вопросов и находите правильные ответы.

Смотреть видео — мобильная версия сайта wordpress

Мобильная версия сайта — плейлист 67 видео

Мобильная версия сайта wordpress на Бизнес на WordPress

    >Какого раздела?
    Раздела с новостями

    >Причем плагин к «мобильной версии»? У Вас и так тема адаптивная (Правда, древнючая, взятая на помойке, с шелами и пр.)
    Извиняюсь, я слабо разбираюсь в вордпрессе в принципе, мне сайт делал один фрилансер. Если плагины тут не помогут, то как мне можно мобильную версию настроить? Обновить тему или другую поставить? Нужно, чтобы этот раздел с новостями (окошко справа) было видно с телефона.

    Раздела с новостями

    Стало ещё менее понятно. Весть сайт состоит из «разделов с новостями». В ВП это называется «рубрики с записями». Или же Вы имеет ввиду что-то другое.

    Извиняюсь, я слабо разбираюсь в вордпрессе в принципе, мне сайт делал один фрилансер.

    Как моно скорее выкинуть эту помоечную тему если не хотите иметь проблем. Брать темы нужно только из оф каталога . Как и плагины.

    Если плагины тут не помогут, то как мне можно мобильную версию настроить?

    Что Вы имеете ввиду под » мобильную версию настроить»? Адаптивная тема — это есть «для мобильных».

    Нужно, чтобы этот раздел с новостями (окошко справа) было видно с телефона.

    Какое «окошко справа»? Я ничего такого не вижу.

    >Стало ещё менее понятно.
    Сделал скриншот, чтобы было понятнее:
    https://ibb.co/cwnSnH

    >Что Вы имеете ввиду под » мобильную версию настроить»?
    Я имею в виду настроить то, что в мобильной версии отображается. Потому что сейчас в ней не видно этого окна (на скриншоте)

    >Как моно скорее выкинуть эту помоечную тему если не хотите иметь проблем. Брать темы нужно только из оф каталога. Как и плагины.
    А какие проблемы могут быть? Я, конечно, подумаю об этом, но в ближайшее время нет ресурсов, чтобы сайт полностью переделывать. Плагины я только официальные ставлю.

    Я имею в виду настроить то, что в мобильной версии отображается. Потому что сейчас в ней не видно этого окна (на скриншоте)

    У Вас скрываются сайдбар/виджеты. Это в принципе нормально. Если хотите чтобы показывалось — нужно переделывать или менять тему.

    А какие проблемы могут быть?

    От невозможности получить помощь до левых ссылок и взлома сайта с очень плохими последствиями .

    Контент сохранится полностью. Об этом можно даже не беспокоиться. Но в любом случае придется повозиться с настройками темы и может перенастройкой некоторых плагинов, отвечающих за внешний вид — например вывод галерей. Но это чисто технические вопросы, они 100% решаемы. А скорость решения проблемы зависит от вашего опыта, умноженного на сложность поставленной задачи.

    Как переделать тему, чтобы сайдбары и виджеты отображались?

    Была бы тема из оф каталога — можно было бы сказать что-то определённое, а как что сделано в этой теме…

    Насколько сложно поменять тему (на надежную и официальную) с сохранением всего загруженного контента?

    >Была бы тема из оф каталога - можно было бы сказать что-то определённое, а как что сделано в этой теме…
    Вообще я смотрел некоторые скриншоты из руководств и у меня консоль выглядит примерно так же, как и у всех.

    >Контент в целом не зависит от темы. Но если в теме использовалось что-то не стандартное, то работы уже побольше.
    Понятно. В общем, буду копить денег и искать более толкового программиста. Сам я, конечно, не смогу все это сделать.

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

    Консоль не причем. Проблема в доступности кода темы (и не предлагайте скачать этот хлам.)

    В общем, буду копить денег и искать более толкового программиста. Сам я, конечно, не смогу все это сделать.

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

Просмотр 10 ответов - с 1 по 10 (всего 10)

  • Тема «Посоветуйте плагин для настройки мобильной версии» закрыта для новых ответов.

Приветствую друзья. 2 февраля Яндекс анонсировал в своем блоге для вебмастеров новый алгоритм ранжирования сайтов в мобильном поиске – Владивосток. Суть его сводится к тому, что при запросах с телефонов поисковая выдача будет строиться с учетом адаптивности сайта к показу на маленьких экранах смартфонов.

Раньше этот фактор не учитывался, но тот, кто подсуетился заранее, сейчас окажется в выигрыше – будут выше в поиске, получат больше трафика, заработают больше денег. Подробнее новость смотрите тут . Google подобную методику начал применять еще раньше.

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

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

Для начала надо понять, что есть 3 пути адаптации вашего ресурса под мобильный поиск:

  1. Создание отдельной мобильной версии сайта на поддомене или другом домене.
  2. Использование адаптивной темы WordPress, которая автоматически меняет размеры и расположение элементов при открытии на маленьких экранах.
  3. Применение разных тем оформления в зависимости от устройства – на компьютере будет один шаблон, для телефона другой (более простой и компактный).

Про первый случай говорить не хочется, так как это неэффективно, по сути, вы делаете отдельный сайт, а вот оставшихся 2 доступны для блоггеров.

Адаптивные темы для WordPress

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

Аналогичным образом поступайте при заказе платных шаблонов – указывайте в техническом задании обязательную адаптацию под мобильные устройства.

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

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

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

Устанавливать плагины легко и с этим справится даже начинающий вебмастер. Как устанавливать плагины смотрите .

Все плагины, которые я приведу ниже, есть в каталоге WordPress и они устанавливаются прямо через админку.

1. WPtouch Mobile Plugin

Самый первый плагин для мобильной версии сайта, с которым я познакомился, он же и самый известный. Пример работы на моем сайте DmitriyZhilin.ru

В бесплатной вариации он содержит только один шаблон, но его можно настраивать – менять цвета шрифтов, фона, кнопок и т.д. Есть возможность добавить свой код в подвал и дополнительные CSS стили прямо из панели настроек.

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

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

2. WordPress Mobile Pack

Как и предыдущий вариант, имеет одну бесплатную тему, а остальные открываются после приобретения PRO версии.

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

Управление и настройки плагина WordPress Mobile Pack на английском языке, но все интуитивно понятно, тем более, что все начинает работать сразу после активации и можно дополнительно ничего не делать.

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

Чуть не забыл – необходима версия PHP вашего хостинга не ниже 5.3.0

3. Плагин Mobile Smart

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

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

Нужна адаптивная тема для сайта (о которых я рассказывал в начале). Но тут фишка в том, что эта адаптивная тема работает не постоянно, а только для пользователей телефонов, всем остальным посетителям сайт выдает обычный ваш шаблон (не адаптивный).

4. WP Mobile Edition

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

  • Минималистичный дизайн (показал максимальную скорость и адаптивность в PageSpeed Insights от Google)
  • удобное меню, специально адаптированное к маленьким экранам,
  • удобная главная страница с последними статьями,
  • кнопка переключения на обычную тему из мобильной и шорткод для размещения кнопки перехода в мобильную версию из обычной (этого не было в рассмотренных выше).

Плагин на русском, причем, перевод хороший. Хотя, необходимость в нем отсутствует, так как после активации я никаких настроек не делал.

Сам дизайн пока один, но он содержит несколько цветовых схем.

Единственный минус, тема показывает миниатюры записей, а так как у меня их нет, то напротив заголовков стоят пустые квадратики (на скрине видно). Не особо портят они внешний вид сайта, но отключить показ миниатюр возможности нет – жаль.

Какой плагин выбрать?

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

Сначала испытайте плагины с мобильными темами – 1, 2, 4. Если ни один из них вам не приглянется, то ищите хорошую тему с адаптивным дизайном и подключайте ее для мобильных пользователей плагином Mobile Smart (3), тут уж никаких ограничений нет – использовать можно любой шаблон.

Не забудьте про кэширование

Если вы используете на сайте плагины кэширования (а использовать их надо обязательно), то учитывайте, что пользователи видят страницы сохраненные в кэше, а не генерируемые CMS, поэтому без соответствующих настроек, разделения страниц для мобильных и стационарных посетителей не будет – из кэша будет приходить одинаковая страница.

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

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

Такие посетители обычно заходят на сайт через планшет или смартфон. Естественно, что ваши веб-сайты должны быть адаптированы для мобильных устройств, иначе мы можем потерять таких посетителей.

Как же этого достичь? Надо сделать наши веб-сайты адаптированными для мобильных устройств. В этой статье содержится обзор семи плагинов, которые помогут вам сделать ваш сайт более красивым и удобным для посетителей с мобильных устройств.

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

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

1. Hammy

Hammy – удобный плагин, изменяющий размеры изображений на вашем сайте для правильного отображения на мобильных устройствах. Он заменяет теги на

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

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

2. Responsive Widgets

Responsive Widgets – плагин, который вводит новые текст/HTML виджеты для WordPress, которые появляются только в определённых устройствах, таких, как iPads, Nooks, PlayStation Vita и других универсальных устройствах, таких, как планшеты или смартфоны.

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

  • Mobile
  • Mobile (landscape)
  • iPhones and iPods
  • Phablets
  • Tablet (portrait)
  • Tablet (landscape)
  • iPad Portrait
  • iPad Landscape
  • Nexus Tablets
  • Kindle Tablets
  • Surface Tablet
  • Nook Tablets
  • PS Vitas
  • Desktops
  • Large Monitors (1240px+ screens)
  • Print only
Многие виджеты имеют флажки, позволяющие делать исключения. Например, если вы хотите посмотреть виджет на планшетах, но не на iPad, вы можете выставить флажок, и вы получите нужную информацию.

3. Responsible

Responsible – очень полезный плагин для WordPress, который проверяет адаптивность ваших страниц «на лету» в браузере. Он использует Viewport Resizer Bookmarklet в панели, зафиксированной в верхней части вашей страницы, где вы можете изменять размер страницы для мобильных устройств, таких, как смартфоны, планшеты или настольные экраны, и выставлять нужные вам размеры.

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

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

4. WPTouch Mobile Plugin

Этот плагин имеет более пяти миллионов загрузок и рейтинг 3.9 из 5 звёзд. WPTouch является, вероятно, самым популярным плагином для мобильных тем на сегодняшний день. Он позволяет создать мобильную версию вашего сайта очень простым способом, полностью автоматизированным.

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

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

5. WordPress Mobile Pack

WordPress Mobile Pack – ещё один хороший плагин, который предлагает мобильные темы для WordPress сайтов. Сейчас он имеет более 600 000 загрузок и рейтинг 3.8 из 5 звёзд. WordPress Mobile Pack предлагает уникальную мобильную тему для вас и посетителей ваших сайтов – мобильное приложение-интерфейс вместо классического интерфейса для мобильных телефонов.

Как и WPTouch, WordPress Mobile Pack – это полностью готовый к использованию плагин сразу после того, как вы установите и активируете его. Если хотите, вы можете внести некоторые коррективы на странице конфигурации.

6. Jetpack by WordPress.com

Jetpack – не только один из самых популярных плагинов для WordPress, он также поддерживается WordPress.com и Automattic. Этот плагин также имеет функцию «Мобильная тема», которая может быть вам очень полезна

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

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

Понравилась статья? Поделитесь ей