Мобильная адаптация сайтов на InstantCMS 1.X.

#ой
я просто оставлю это здесь, думаю даже бесплатно так делать не стоит



последняя страница — яхты на карте, полоски слева и справа — только они скроллят страницу

Как раз столкнулся с такой проблемой.
У меня instantcms2. На смартфоне сайт отображается корявенько, не полностью.
Слайдер и текстовый виджет не хотят отображаться полностью, а только на полстраницы.
Подскажите кто-нибудь, как адаптировать сайты под мобильные устройства?

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

Как раз столкнулся с такой проблемой.
У меня instantcms2. На смартфоне сайт отображается корявенько, не полностью.
Слайдер и текстовый виджет не хотят отображаться полностью, а только на полстраницы.
Подскажите кто-нибудь, как адаптировать сайты под мобильные устройства?

3 способа адаптировать сайт под мобильные устройства:

1. Адаптивный дизайн – «резиновая верстка».
В стилях включить view-port и @media screen and (max-width:….).
Фиксированные размеры заменить на проценты у размеров элементов и шрифтов.
При необходимости скриптами JS перемещать, отображать или скрывать элементы на страницах.
При необходимости заменить табличную верстку элементов на блочную или использовать display: flex для строк таблиц.
Плюсы – быстро, прозрачно. Узнаваемый дизайн сайта на всех устройствах.
Минусы – «Увеличенный» код скриптов, стилей — одинаково грузятся на всех устройствах все файлы страницы, но при современных скоростях и мощностях, чаще всего не критично.

2. Отдельный шаблон для мобильных устройств на том же домене.
Плюсы — возможность упростить дизайн сайта, уменьшить количество активных элементов, т. е. сделать сайт «легче».
Минусы – сложность реализации администрирования — управление и настройка элементов сайта для разных шаблонов по разному.

3. Мобильная версия сайта на поддомене.
Плюсы — возможность упростить дизайн сайта, уменьшить количество активных элементов, т. е. сделать сайт «легче».
Минусы — нужно создавать поддомен и администрировать его, создать отдельный сайт. Двойная работа по сопровождению (дублировать контент) или настраивать работу сайтов с одной БД.

Дмитрий @gdg спасибо.
По всей видимости адаптивный — это лучший вариант.
А чайнику в программировании, но профессиональному любителю инстанта, получится самостоятельно сделать?
Пока не представляю вообще что и куда надо.

А что насчёт такого варианта instantcms.ru/addons/demo/519
Слева от кнопки "Войти" есть кнопка "Изменить формат сайта" (для компьютеров, телефонов, планшетов).
Как сделать также себе? Есть такой компонент?

Polzovinst, дополнение о котором вы спрашиваете, видимо, предназначено для настройки контента для разных шаблонов.
Для переключения шаблонов есть отдельные модули (виджеты), например "Смена шаблона".

Если у вас вторая ветка, по моему будет проще настроить стили, там где

отображается корявенько

.

Модуль "Смена шаблона" несколько раз раньше и сейчас заливали и через фтп, и через админку компонентов обновлял. Не отображается в виджетах выбор шаблона всё-равно.
Так эти шаблоны будут влиять на адаптивность? И дизайн соответственно будет шаблонный?

Polzovinst
Модуль "Смена шаблона" — только переключает существующие у вас на сайте шаблоны.
Шаблон — набор файлов — каталог в папке Templates.

Polzovinst
Модуль "Смена шаблона" — только переключает существующие у вас на сайте шаблоны.
Шаблон — набор файлов — каталог в папке Templates.

Спасибо, что разъяснили.

Слева от кнопки "Войти" есть кнопка "Изменить формат сайта" (для компьютеров, телефонов, планшетов).
Как сделать также себе? Есть такой компонент?

instantcms.ru/blogs/esli-dolgo-muchitsja/perehod-mezhdu-versijami-saita-dlja-razlichnyh-ustroistv.html

Слева от кнопки "Войти" есть кнопка "Изменить формат сайта" (для компьютеров, телефонов, планшетов).
Как сделать также себе? Есть такой компонент?

Зачем придумывать то такое? Есть два типа работы с мобильными устройства. Первый просто адаптивный сайт, который не резиновый, а именно верстается адаптивным, используя логику и второй тип работы — мобильное приложение. Второе оставим в стороне, а по первому не нужны никакие кнопки, все должно реагировать правильно на размер устройства.

Изучите yandex.ru/yandsearch?clid=1222110&text=%D1%87%D1%82%D0%BE%20%D1%82%D0%B0%D0%BA%D0%BE%D0%B5%20%D0%B0%D0%B4%D0%B0%D0%BF%D1%82%D0%B8%D0%B2%D0%BD%D0%BE%D1%81%D1%82%D1%8C%20%D1%81%D0%B0%D0%B9%D1%82%D0%B0&lr=971&redircnt=1495037549.1 потратьте часа три времени, прочитайте, поймите.

Никаких мобильных версий уже не делают, на крайний случай внедряют AMP страницы и связано это с очевидно лишним трудом и ненужностью для пользователя. Иногда встречаю возможность авто переключения отображения, но это опять же на уровне логики и для очень серьёзных продуктов в этой сфере.

Зачем придумывать то такое?

Да и вообще зачем думать?

Слева от кнопки "Войти" есть кнопка "Изменить формат сайта" (для компьютеров, телефонов, планшетов).
Как сделать также себе? Есть такой компонент?

Есть два типа работы с мобильными устройства. Первый просто адаптивный сайт, который не резиновый, а именно верстается адаптивным, используя логику и второй тип работы — мобильное приложение.

Я думал адаптивный и резиновый — это почти одно и тоже.

Мне по сути эта адаптивность нужна из-за:
1) Ньюмесседжер не открывается в смартфоне вообще
2) Карта гугл отображается, но улицы и номера домов не отображаются
3) (Важное) Главное меню сделано в виде картинок-иконок, (и под ними слова). 2 ряда, в каждом 6 пунктов.
И вот из 12 кнопок меню видны лишь четыре, два с верхнего ряда, два с нижнего.

Да и вообще зачем думать?

Олег, при всём уважении: это инструмент для вёрстки или так и задумывалось для посетителя? Второй вариант мне неясно зачем это.

Мне по сути эта адаптивность нужна из-за:
1) Ньюмесседжер не открывается в смартфоне вообще
2) Карта гугл отображается, но улицы и номера домов не отображаются
3) (Важное) Главное меню сделано в виде картинок-иконок, (и под ними слова). 2 ряда, в каждом 6 пунктов.
И вот из 12 кнопок меню видны лишь четыре, два с верхнего ряда, два с нижнего.

Автомобиль нужен, чтобы:

— руль был
— коврики на полу лежали
— тонировка сзади была

так прочитал ваши пункты.

Адаптивность нужна вам не только потому, что у вас 3 пункта, которые вы заметили. Адаптивность это удобство представления сайта и оценка поисковика в том числе. Посетитель, который для вебмастера наше всё и овёс тоже, он хочет видеть удобно на всех устройствах.

А резиновым называли как правило шаблон, который просто тянется.

Олег, при всём уважении: это инструмент для вёрстки или так и задумывалось для посетителя? Второй вариант мне неясно зачем это.

Писалось именно тебе.

так прочитал ваши пункты.

Потому что твои пункты прочитал так: мне нечего делать, потому я буду вас тут учить жизни сайты крутые делать.