1

Нужно сделать правильный редирект на мобильную версию сайта, если я планирую сделать её в виде m.xxx.yyy, если ширина экрана <850px

2 ответа 2

2

Если используете Apache, то пропишите в файле .htaccess следующее:

RewriteCond %{HTTP_HOST} ^xxx\.yyy$ [NC]
RewriteRule ^(.*)$ http://m.xxx.yyy/$1 [R=301,L]

Если вам требуется редиректить пользователя при определенной ширине экрана, то определяйте ее в JS при загрузке страницы и если она меньше определенного значения, то делаете редирект:

window.addEventListener('DOMContentLoaded', function() {
    if (window.screen.availWidth < 850)
        window.location = window.location.href.replace('://', '://m.');
});

Если требуется выставить редирект по ширине окна (с учетом zoom браузера), то вместо window.screen.availWidth используем window.innerWidth:

window.addEventListener('DOMContentLoaded', function() {
    if (window.innerWidth < 850)
        window.location = window.location.href.replace('://', '://m.');
});

Но лучше использовать media-queries, чем выносить отдельную версию на поддомен. Будет куда проще в поддержке. В случае необходимости можно переписать некоторые JS-функции под вывод контента для мобильного экрана.

10
  • Да, но я забыл дописать..что нужно при определенной ширине экрана
    – user242433
    7 июл 2017 в 16:11
  • innerWidth возвращает не ширину экрана, а ширину видимой области, которая может оказаться как меньше, так и больше ширины экрана
    – andreymal
    7 июл 2017 в 16:29
  • @andreymal поправил код 7 июл 2017 в 16:33
  • За редирект в ресайзе надо руки отрывать.
    – Qwertiy
    7 июл 2017 в 16:33
  • @Qwertiy поправил код 7 июл 2017 в 16:33
1
if (window.screen.availWidth < 850) {
  window.location.href = window.location.href.replace('://', '://m.')
}

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.