Другая главная страница для мобильных

Другая главная страница для мобильных Wordpress

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

Существует очень простая в использовании функция WordPress, которая позволяет обнаруживать мобильные устройства. Поэтому, если вы хотите менять главную страницу для мобильных устройств, то WordPress имеет простую и удобную функцию (wp_is_mobile()). С помощью этой функции вы можете легко показывать или скрывать контент на мобильных устройствах.

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

Поскольку большинство тем WordPress адаптивны, и не требуется никаких специальных изменений для мобильных устройств. Вы можете изменить макет для мобильных устройств, используя медиа-запросы (CSS). Но если требуется перенаправить мобильных посетителей на другую главную страницу, то есть 4 варианта как это реализовать.

1. Добавление кода в header.php

Создаем отдельную страницу для мобильных устройств и используем функцию wp_is_mobile ().

Например, создадим страницу с именем mobile. Чтобы перенаправить на эту страницу пользователей мобильных устройств, поместим следующий код вверх файла header.php.

С главной или на главную страницу WordPress пользователи мобильных устройства будут перенаправлены на http://site_url.com/mobile. Также можете использовать заголовок (‘Location: http:// site_url/ mobile’); вместо wp_redirect.

2. Создание шаблонов страниц для каждого устройства

Я использую это на своем другом сайте, чтобы показывать другую главную страницу для мобильных пользователей. В активной теме делаем 2 копии файла page.php. Первый файл сохраним с именем page-desktop.php не меняя в нем ничего. Так как он будет отвечать за вывод главной страницы на компьютерах.

Во втором файле переписываем код, чтобы отображение главной страницы на мобильных устройств было иное. Присвоим имя файлу page-mobile.php. Удаляем из файла page.php все содержимое, и прописываем следующий код:

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

3. Использование хука wp_print_scripts

Для справки, вы можете реализовать эту функцию без редактирования файла темы WordPress, если вы используете фильтр или действие, такой как wp_head. Однако функция wp_is_mobile () не работает с действием wp_head. В этом случае можно использовать действие wp_print_scripts.

Таким образом, вы можете легко перенаправить мобильных пользователей на мобильную страницу без каких-либо других сценариев, если вы используете wp_is_mobile ().

4. Cгенерировать шорткод для контента

Wp_is_mobile устанавливает значение «true», когда страница посещается через мобильный браузер, что позволяет показать или скрыть информацию. Фрагмент кода позволяет использовать короткие коды [mobile] [/ mobile] и [desktop] [/ desktop] для «маркировки» определенных текстов.

Чтобы сгенерировать шорткод, который будет отображать или скрывать текст на смартфонах, нам нужно вставить некоторый код в functions.php (активной) темы WordPress. При внесении изменений такого типа всегда используйте дочернюю тему, а также делайте резервную копию файлов перед внесением изменений.

Теперь мы можем обернуть любой текст, который должен отображаться только в мобильном браузере, с помощью шорткода [mobileonly] [/ mobileonly].

Заключение

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

Вы в настоящее время используете wp_is_mobile()функцию в своей теме? Если так, я хотел бы узнать, каков ваш вариант использования.

Оцените статью
Добавить комментарий

  1. Александр Затынин

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

    Ответить