Основная версия сайта уже есть, макеты для мобильной есть. Нужно создать мобильную версию сайта. Как это делается?
Явно не проверкой браузера и if/else, верно? Возможно, есть какой-то модуль, который использует другую тему для мобилок, или я неверно понимаю процесс...
Комментарии
Здравствуйте pingvin156,
В большинстве случаев используется адаптивная тема.
Я так понимаю адаптивная тема настраивается под ширину. А если еще необходима возможность принудительного переключения между версиями: мобильной и десктопной?
bootstrap
У меня как раз bootstrap. Только не очень-то понимаю, что именно надо делать. Мне нужно, чтобы автоматом определялось: мобильная/десктопная и был переключатель
Поиск на ютубе: бутстрап адаптивная вёрстка
В случае с бутстрепом как бы нет принципиальной/концептуальной разницы между мобильным и десктопом. Десктопную версию можно рассматривать так же, как мобильную, но только с очень большим числом возможных колонок (т.е. технически просто очень большой размер устройства). И наборот - мобильная версия это обычно одноколоночный вариант десктопной. В этом, собственно, и есть удобство и прелесть работы с бутстрепом - нет нужды писать медиазапросы под каждый размер устройства, всё делает прозрачно ядро бутстрепа. Остаётся только продумывать layout'ы в ключевых ширинах устройств и устанавливать классами поведение колонок.
В этой связи мне как-то не понятно: а зачем вообще понадобилось что-то под бутстрепом устанавливать принудительно "переключателем"? Какая в этом реальная необходимость - кроме "мне так хочется" ?
PS. На всякий случай: подобной "волшебной кнопки" в бустрепе нет. Думаю, вопрос состоит в том, чтобы принудительно динамически (или на JS, по каким-то событиям типа клика) устанавливать ключевым колонкам типичные для десктопа классы типа "col-lg-X" и опять же принудительно удалять типичные "мобильные" классы типа "col-xs-X" и "col-sm-X". Но, имхо, это какой-то изврат.
В конкретно моем случае проблема заключается в том, что разница между десктопной и мобильной версиями довольно существенная. Наверное, просто не получится....
Я вот думал насчет адаптивной верстки, но как он определяет. Вот в шаблоне какая переменная отвечает за версию.. мобильную или десктоп... Думал вариант с переключателем тем, т.е. вообще создать 2 темы и каким-то образом переключаться между ними... или изврат?
А про переключатель - это требование заказчика.
CSS media
На самом деле распространённая практика. И для Друпала есть готовые модули, позволяющие переключаться между темами на "лицевой стороне". Но обычно темы переключаются между какими-то вариантами оформления/дизайна, а не версиями "мобильный - десктоп".
media queries ещё никто не отменял, даже под бутстрепом.
Бутстрап он адаптивный сам по себе. Но тема оформления - это шапка, сайдбары, подвал. Если у вас эти области не адаптивны, вы (или вам) конкретно накосячили.
А есть контент. В Друпале это ноды, вьюсы, панели. Их надо делать адаптивными. Есть модули, помагающие адаптировать вьюхи и панели под Бутстрап, но легче руками прописывать медиазапросы в CSS и ставить классы Бутсрапа в дивах выводимого контента.
Сделайте жс переключалку класса для боди. Когда она включена, то у боди мин видтх 1200 пкс, а когда выключена, то 100%. Ну и конечно же, теорию бы вам подтянуть, а то некоторые высказывания слегка шокируют.
ну да, конечно автор сделает переключалку на ЖС.
Я так понимаю, что контент страницы будет отличаться, одной вёрстки может быть недостаточно.
Вот тут обсуждалась такая ситуация.
Согласен, еще "плаваю" в теме, но очень стараюсь разобраться...
Возможен ли такой вариант: через js сделать переключалку, которая устанавливает переменную для шаблона и уже дальше, чтобы шаблон (через theme_preprocess_page или page.html.twig) скрыл два региона: primary и secondary - по идее мне этого будет достаточно, а остальное, как говорится, дело техники
В общем, надо как-то повлиять на отображение регионов: включить/выключить (причем автоматом в зависимости от ширины экрана), но не через css, чтобы не грузить весь контент...
Не забывайте, что адаптивность нужна не только при загрузке, но и при ресайзе страницы.Если у вас контент не подгрузится, то и при ресайзе он не появится, как это было бы, если бы использовались CSS media queries
Одной верстки волне может быть достаточно, если вносить изменения типа:
.selektor {
display: none;
}
}
Другое дело что вам может понадобиться переверстка. Сайт показывайте.
Отдельная мобильная версия в эпоху амп и турбо-страниц - полный анахронизм.
Значит я анахроник. Притом полный
Я никому не рассказываю что у меня 2 CORE DRUPAL... Ещё рано.
в 7ке легко делается через https://www.drupal.org/project/context_breakpoint
в 8ке breakpoint-ы в ядро встроены, но там все сложно
Думаю, breakpoint-ы подойдут. Осталось научиться их отлавливать и обновлять структуру темы по этим breakpoint...
В противном случае, все придется писать на JS и css, а это не есть тру