amp-web-push-widget button.amp-subscribe { display: inline-flex; align-items: center; border-radius: 5px; border: 0; box-sizing: border-box; margin: 0; padding: 10px 15px; cursor: pointer; outline: none; font-size: 15px; font-weight: 500; background: #4A90E2; margin-top: 7px; color: white; box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.5); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .amp-logo amp-img{width:190px} .amp-menu input{display:none;}.amp-menu li.menu-item-has-children ul{display:none;}.amp-menu li{position:relative;display:block;}.amp-menu > li a{display:block;} .icon-widgets:before {content: "\e1bd";}.icon-search:before {content: "\e8b6";}.icon-shopping-cart:after {content: "\e8cc";}
Дизайн сайта

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

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

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

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

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

Мы же остановили свое внимание на сервисе Howtogomo. Для начала создания мобильной версии своего сайта с помощью данного инструмента, вам придется зарегистрироваться. После чего в личном кабинете в специальное поле введите URL сайта. Возле поля должна находиться зеленая кнопка с надписью «Make my site mobile» (сделать мой сайт мобильным).

После ввода адреса сайта нажмите на эту кнопку. Затем  откроется визуальный редактор в виде экрана смартфона, в котором вы сможете сразу наблюдать за всеми внесенными изменениями. Здесь вам нужно настроить расположение меню и цветовую схему. После осуществления данного этапа настройки, нажмите на синюю кнопку «Next». Далее вы перейдете к настройке следующих параметров. С ними вы сможете детально ознакомиться самостоятельно.

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

Теперь осталось сохранить мобильную версию сайта. Для этого нажмите на специальную кнопку «Save me site». Вы получите ссылку, чтобы перенаправлять посетителей на мобильную. Вы также можете самостоятельно настроить редирект, который будет срабатывать только на мобильных устройствах.

Если же вы не уверены в своих силах, то перейдите к следующему шагу настройки мобильной версии сайта. В окне скопируйте скрипт, и разместите его в файле вашей темы header.php. Код вставьте перед закрытием тегом /head.

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

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

Адель Гадельшин

View Comments

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

  • Очень хочется побыстрее освоиться и понять. Спасибо таким сайтам.

Recent Posts

Что такое отказы на сайте, почему они происходят, как их уменьшить

Отказы на сайте - это процент посетителей, которые покидают сайт после просмотра только одной страницы.…

7 месяцев ago

Как сделать запуск инфопродукта

Инфопродукт - это любой продукт, который содержит информацию, полезную для потенциальных клиентов. Это может быть…

8 месяцев ago

Как вебмастеру юридически обезопасить себя

Ведение сайта - это не только подержание его работоспособности и наполнение контентом. В последние годы…

8 месяцев ago

Папки WordPress: значение папок /wp-admin, /wp-includes и /wp-content

WordPress - это популярная система управления контентом (CMS), которая позволяет создавать и управлять веб-сайтами различной…

8 месяцев ago

Что такое сертификат Let’s Encrypt и стоит ли его устанавливать

Сертификат Let’s Encrypt - это бесплатный и открытый сертификат SSL/TLS, который позволяет защитить веб-сайт от…

8 месяцев ago

Защита WordPress от вирусов

WordPress - это одна из самых популярных систем управления контентом в мире, которая используется миллионами…

9 месяцев ago