Всем привет! Интересует такой вопрос - как создать полно экранный адаптивный баннер (слайдшоу) на ОпенКарт 3? Используемая мною версия ОпенКарт - 3.0.3.6, оформление - по умолчанию, дополнительных расширений не установлено. Собственно, создать баннер, который будет размещаться во всю ширину экрана десктопа (с шириной в 1920 пикселей) и масштабироваться, если ширина устройства посетителя будет любой другой, не сложно. Если только не обращать внимания на то, что все эти баннеры будут жутко тяжелыми для мобилок... Интересует использование srcset'ов для каждого изображения баннера (слайдшоу). Возможно ли?
Самое простое - установить модуль слайдера который имеет возможность вывода на всю ширину. Так же, можно установить модуль который добавляет дополнительную позицию на всю ширину (или добавить позицию самостоятельно) и перенести слайдер в эту позицию.
SiteMix, спасибо за Ваш ответ! Я сделал так: - чтобы не менять шаблоны в дефолтной теме, клонировал её, - в шаблоне banner.twig избавился от бутстрапового контейнера. Вообще, немного изменил разметку: у меня там всё вложено в секцию (section), включая swipper скрипт. Ну, и в стилях прописал для изображений width: 100%;, чтобы масштабировалось - в Дизайн - Баннеры добавил свой, обозвав Full Width, в котором три изображения каждое размерностью 1920х640 (типа один к трем) - в Модули/Расширения - Банер добавил новый Full Width Banner, ширина и высота которого - те же 1920 на 640 - потом просто вывел его на главной странице через Дизайн - Макеты. Всё! Полно экранный баннер готов. Встроенный swiper прекрасно отработал в плане пересчета ширины и высоты. Всё замечательно работает. (если бы не работало, я бы удивился ) Меня больше интересует тот момент, что вот эти мои картинки с теми же шириной и высотой прогружаются на мобиле... Нет-нет, полос прокрутки нет, изображения вписываются в окно браузера (там же css правило 100%). Общий "дизайн" не нарушается. Картинки просто тяжелые... Сегодня полдня лазил по разным маркетплейсам, типа официального, и на нашем форуме тоже... Искал всё, что есть из расширений, что может пригодиться. Плохо то, что у большинства расширений отсутствуют демки. Если есть ссылка, совсем не факт, что за ссылкой эта демка присутствует (то сервер не отвечает, то хостинг кончился... пипец, блин). Посмотрел несколько реализаций фул скрин баннеров/слайдшоу, включая те, где картинки фоном. Та же самая фигня - картинка максимально возможного размера, которая просто вписывается в окно браузера. То есть, интересен был бы модуль, в котором изображения в слайдшоу(баннере) создавались бы вида <img src="image.jpg" srcset="image@320.jpg 320w, image@640.jpg 640w, image@960.jpg 960w, image@1200.jpg 1200w" alt="Image"> Я уже думаю, может так сделать? - добавить несколько баннеров, один 1920х640, второй 1200х400, третий 640х213... - всё добавить в макет главной - в стилях по айдишникам добавить для всех display: none;, а уже в медиа запросах для разных экранов прописать block, Работать-то оно будет, но это как-то с моей колокольни перебор Хотя, проще использовать HTML content: накидать картинок разной "размерности" в каталог темы и выводить, как захочется...
Не помню где видел, то ли в шаблоне каком-то, то ли в модуле баннера. Скорей, второе. Там в настройках есть возможность задать отдельную картинку и её размер для мобильной версии.
Не помню, к сожалению. Просмотрел несколько слайдеров и несколько шаблонов с которыми работал недавно, но тот, о котором говорил, так и не встретился...
