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

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

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

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

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

Сегодня я расскажу как на 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