Главная » Создание сайтов » WordPress » Делаем мобильную версию сайта на WordPress

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

Актуальность создания мобильной версии сайта просто колоссальна. Это объяснимо по многим причинам, я приведу некоторые из них:

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

  • Мобильный интернет серфинг растет в 8 раз быстрее, чем компьютерный на основе использования WEB;
  • 70% населения планеты имеет мобильный аппарат;
  • В 2010 году абонентов мобильной связи превысило 5 миллиардов;
  • У 85% детей есть собственный телефон, в то время как только у 73% есть книги в домашних условиях;
  • Android растет в размере 886% — 160 000 телефонов Android активизируются ежедневно;
  • 1000000 смартфонов активизируются каждую неделю;
  • Google сообщает, что объем мобильного поиска составляет до 130% по сравнению с аналогичным года;
  • К 2014 году он предсказал, что использование мобильного интернета обгонит настольный использования Интернета.

На собственном примере я бы хотел поделиться с Вами опытом, как сделать собственную мобильную версию сайта на CMS WordPress.

Отдыхая летом на море, у меня не было под рукой ноутбука и просматривать дела в интернете пришлось через мобильный телефон. После того, как я его удачно утопил, мне пришлось пользоваться не столь хорошим мобильным телефоном (SE K750i) у которого не такой большой и удобный экран, на котором отлично отображаются сайты. Я просто был в приятном удивлении, когда у того или иного сайта присутствует мобильная версия, которая загружается автоматически, когда удачно проходит идентификация мобильного устройства и сайт «понимает», что Вы зашли с помощью мобильного телефона и мобильную версию сайта Вам куда лучше просмотреть нежели традиционную.

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

Сегодня я расскажу как на WordPress CMS сделать мобильную версию сайта: какие плагины и некоторые настройки, которые будут полезны при редактировании внешнего вида мобильной версии.

Существует около 10-15 различных плагинов, которые предоставляют возможность сделать версию сайта для мобильных устройств и ныне популярных планшетов. Попробовав каждый из плагинов я остановился на плагине — WordPress Mobile Pack.

WordPress Mobile Pack — это полный набор инструментов с помощью которых Вы легко сделаете мобильную версию сайта. Пакет включает в себя: мобильный переключатель, мобильные виджеты, и содержание адаптации для мобильных характеристик устройства. Сайт отлично работает во всех популярных мобильных ОС (iOS, Android, Palm). Так же, в WP Mobile Pack существует внутренняя статистика по мобильным устройствам (в Инструменты-Mobile Analytics), однако для более точной статистики советую зарегистрироваться и повесить (на мобильную версию) счетчик WapLog.

Итак, загружаем плагин себе на сайт.

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

Вообщем то мобильная версия сайта уже будет работать! Как проверить? — спросите Вы. Качаем Opera Mobile Emulator — эмулятор браузеров различным мобильных телефонов и планшетов. Около 35 мобелей мобильных телефонов, планшетов и КПК будут в вашем распоряжении через одну программу :)

Вводим в адресную строку адрес блог и вуаля — мобильная версия сайта готова :)

Мобильная версия сайта готова!

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

Заходим в Дизайн — Mobile Switcher

Напротив Mobile theme выбираем тему которая вам больше по душе. Остальные настройки я оставил по умолчанию, потому что они меня целиком и полностью удовлетворяют. Хоть плагин и не имеет русифицированную версию — вы методом тыка сможете все настроить, что необходимо.

Мобильные версии шаблонов сайта лежат в wp-content/themes, если вы используете WP Super Cache то вам необходимо обновить правило для модуля mod_rewrite. Для этого просто зайдите на страницу плагина на нажмите на соответствующую кнопку.

Это необходимо для того, чтобы в обновился файл htaccess которые и будет перенаправлять мобильных посетителей на мобильную версию :)

Отредактируйте файлы шаблона по своему усмотрению, так же после активации в footer'e сайта появится «переключалка» между обычной и мобильной версией сайта, которую вы так же с помощью не сложный преобразований сможете вынести в любое удобное Вам место. Мобильную версию сайта так же можно вынести на поддомен, это делается и настраивается в графе Mobile Switcher.

Поставив WapLog счетчик и отписав в Support Яндекса с вопрос все ли сделано без проблем и ошибок, они дали положительный вариант моей мобильной версии сайта!

С Уважением, VanoID С уважением, Vasilenko Ivan!
15 января 2012 в 22:4212 комментариев WordPress

Комментарии — 12 комментариев

  1. #18829 individd в 12:59, 8 февраля 2013:

    Ответить | Цитировать

    Спасибо огромное за статью очень помогла

  2. #18830 vanoID в 15:41, 8 февраля 2013:

    Ответить | Цитировать

    @ individd:

    Пожалуйста!

  3. #21331 Вадим в 20:13, 11 июля 2013:

    Ответить | Цитировать

    Спасибо) Буду пробывать на своем сайте)

  4. #24465 Евгений в 15:18, 31 декабря 2013:

    Ответить | Цитировать

    Спасибо огромное за статью, очень помогло сделать мобильную версию сайта

  5. #25303 Дима в 20:20, 24 февраля 2014:

    Ответить | Цитировать

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

  6. #25306 vanoID в 22:20, 24 февраля 2014:

    Ответить | Цитировать

    @ Дима:

    Можете закрыть через robots.txt индексирование сайта.

  7. #36668 Виктор в 10:37, 17 октября 2014:

    Ответить | Цитировать

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

  8. #36671 Виктор в 11:35, 17 октября 2014:

    Ответить | Цитировать

    нашел старую версию, но как оказалась дело не в самой версии плагина

  9. #44598 Валерий в 1:42, 16 января 2015: (подписался)

    Ответить | Цитировать

    а реклама гугла будет в нем поддерживаться?

  10. #48685 vanoID в 10:40, 4 апреля 2015:

    Ответить | Цитировать

    @ Валерий:

    попробуйте и расскажите нам)

  11. #48686 vanoID в 10:41, 4 апреля 2015:

    Ответить | Цитировать

    @ Дима:

    можно ведь в robots.txt закрыть мобильную версию

  12. #53771 Максим в 1:53, 9 февраля 2016: (подписался)

    Ответить | Цитировать

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

Добавить комментарий

имя:

e-mail:

сайт:

текст:

Subscribe without commenting