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

Опубликовано: 06.09.2018

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

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

Делаем ваш сайт доступнее! Сегодня вы узнаете о том, как сделать мобильную версию сайта на wordpress для пользователей, которые заходят в Интернет с мобильных устройств. Для этого мы используем сервис dudamobile.



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

Напомню, что на прошлом занятии мы с вами сделали поиск по сайту и улучшили его с помощью плагина. Заходим на сайт http://my.dudamobile.com. Можете зарегистрироваться или авторизоваться через Фэйсбук. В поле вводим адрес своего сайта (URL)и жмем на синюю кнопку Make my site mobile!


Как легко и просто можно создать мобильную версию сайта Адаптивный дизайн от профи

В открывшемся окне вы увидите свой сайт в мобильном телефоне.


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

Без вашего участия автоматически запускаются настройки: Дизайн (Design), Редактировать страницы (Edit Pages)и Опубликовать свой сайт (Go live). Начнем с Дизайна.

Дизайн - как сделать мобильную версию сайта на wordpress

1. Макет (Layout). Выбираете тип навигации: список, матрица, расширяющийся, нижний, верхний; затем стиль.

2. Стиль (Style). Здесь настраиваете цветовую палитру, выбираете фоновое изображение, настраиваете стиль шрифтов. В основе предложенных вариантов цветовой палитры всегда лежат основные цвета вашего сайта, либо гармоничные с ними цвета – более 10 вариантов. Фоновое изображение можно загрузить со своего сайта, стороннего ресурса или выбрать из предложенных. Смело экспериментируйте, потому что удалить будет просто.

3. Заголовок (Header). Автоматически подгружается эмблема сайта. Ее можно заменить другим изображением или текстом. Изображение ровняется по правому, левому краю или центру; регулируется его размер.

На изображении доска объявлений Лучшие вакансии студентам и выпускникам, ее мобильная версия. Здесь установлены:

Макет: список прозрачный с иконками (customize). Стиль: Без фонового изображения. Стиль шрифтов – базовые настройки. Заголовок: 50% от загруженного, выровнен по центру, цвет фона изменен.
Редактирование страниц - как сделать мобильную версию сайта на wordpress

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

Публикация - как сделать мобильную версию сайта на wordpress

Перед публикацией мобильной версии сайта вам предлагается тарифный план: бесплатно или за $9 в месяц. Бесплатная версия включает: загрузку 10 страниц, просмотр 500 страниц пользователями; платная: неограниченное число страниц и просмотр, круглосуточную техническую поддержку со стороны dudamobile, вызов мобильной карты, доменное имя – ваше впереди которого будет буква m. На первом этапе работы сайта эти дополнительные функции не нужны, поэтому выбираете бесплатный тарифный план и нажимаете синюю кнопку.

Открывается окно, которое предлагает вам настроить переадресацию сайта. На первом шаге скачиваете плагин, загружаете его на сайт. На 2-ом шаге – активируете. После активации нажмите синюю кнопку «Yes» Да. Ваша мобильная версия готова!

Теперь вы знаете, как сделать мобильную версию сайта и ваш сайт получит дополнительный трафик. (На миниатюре в начале статьи вы видите мобильную версию доски объявлений "Лучшие вакансии студентам и выпускникам".

Руководство для первокурсника: как сделать мобильную версию сайта на wordpress

IRC (Internet Relay Chat)
rss