Посещая сайты мы часто встречаемся с таким функционалом, как карусель изображений. Обычно, в стандартном представлении карусели, это некий список брендов или производителей, которые обычно размещают ближе к подвалу сайта или же в необходимом месте. Так же вариантом исполнения, это вместо брендов, выставляют фотографии выполненных работ (или избранных изображений), которые постоянно прокручивают в определенном блоке.
На самом деле использование функционала карусели изображений в конструкторе сайта не ограничивается брендами или списком изображений расположенных в ряд. Возможно использовать функционал как слайдшоу, т.е отображение всего лишь одного изображения в блоке с возможностью прокрутки. И все это нам позволяет делать виджет.
Виджет "Карусель" предназначена для отображения списка изображений в один ряд. Количество изображений отображаемых в ряду, устанавливается настойками виджета. Доступно отображения или скрытия дополнительных элементов, такие как стрелки, точки навигации, включения лайтбокса. А так же изменения поведения и настроек самой карусели (скорость, остановка, эффект) и различные стилевые оформления.
На изображении выше мы видим две карусели. Та что сверху это карусель по умолчанию, а ниже карусель в виде слайдшоу т.е в настройках указано, что необходимо отображать только 1 изображение. Настроек у виджета карусели много и они разнообразны и очень похожи на настройки похожего виджета это "Медиа карусель". Рассмотрим настройки и стилевые свойства виджета.
Содержимое
- Карусель
- Изображения - добавление изображений в карусель. Используется стандартные средства медиа библиотеки и создания галереи.
- Размер изображения - выбор из предустановленных размером изображений или установка своих размеров средствами конструктора.
- Показывать слайдов - количество изображений в карусели, которые отображаются в текущий момент. Если установить отображение в 1 слайд, то появляется опция для изменения эффекта смены изображений.
- Прокручивать слайдов - количество прокручиваемых изображений за одну инерцию, автоматическую или вручную.
- Растягивать изображение - опция растягивания изображения по размеру блока, даже если изображение меньше необходимого размера.
- Навигация - выбор навигации между отображением всех видов или только одного, например стрелки.
- Ссылка на - ссылка на ресурс после клика т.е возможно установить произвольную ссылку или выбрать ссылку на текущие изображение.
- Лайтбокс - отключение или включения функции всплывающего окна после клика на изображение.
- Подпись - выбор источника для подписи. Доступно выбрать из заголовка изображения, подписи или описания. Все эти значения устанавливаются в медиа библиотеки, при загрузки изображений или их выборе.
- Дополнительные опции
- Пауза при наведении - останавливает движение карусели при наведении на нее курсором мыши.
- Проиграть автоматически - автоматический запуск карусели при старте страницы.
- Скорость листания - скорость пролистывания карусели.
- Зациклить листание - повторное листание изображений по кругу т.е после последнего изображения, сразу начинается первое.
- Эффект - выбор эффекта при смене слайда. Выбор между скольжением и выцветанием. Данная настройка доступна если у вас отображается только один слайд за раз.
- Скорость анимации - скорость анимации при переходе от одного слайда к другому.
- Направление - направление движения слайдов карусели по умолчанию, влево или вправо.
Стили
- Навигация
Изменение стилевых свойств элементов навигации, таких как позиция, размер и цвет для стрелок и точек навигации.
- Изображение
Свойства стилей изображения: Отступ, Тип границы и ее свойства и скругления углов.
- Подпись
При наличии подписи, возможно изменить цвет, типографику и выравнивание относительно изображения.
Алтынай
здравствуйте! можно ли на карусель нанести текст ?? спасибо)
Админ
День добрый. В данном виджете можно вывести подпись снизу изображений, а дальше с помощью стилей сместить на изображение. Или воспользоваться другим виджетом https://blog.web5x.ru/media-karysel-widget-elementor-pro/
Алишер
Здравствуйте!
Я ставил карусель добавил галерею в режиме редактирование показывает картинки а вот в режиме просмотра нет. В чем проблема?
Геннадий
У меня была такая же проблема. После обновления у Elementor в настройках появилась вкладка «Эксперимены». Там альфа и бета версии улучшения. Отключил «Улучшенная загрузка ресурсов». После этого слайдер заработал.
Админ
Здравствуйте. Я не знаю в чем проблема, в слепую сложно ответить. Может кеш браузер очистить, может какой то плагин создает ошибку, может сама версия элементора не совместима с версией движка, может вирус. Если есть версия PRO, то может обновить до последней версии и элементор и версию PRO.
Андрей
Добрый день! Возможно ли как-то поменять точки навигации на цифры, чтобы было, к примеру — 1/5, 2/5, 3/5 и т.д.?
Админ
День добрый. Простых способов нет.
Елена
Добрый день.
Создала карусель, но при проигрывание на мобильной версии возникают пустые слайды. Все настройки перепробывала, пустота не исчезает.Как исправить?
Админ
День добрый. Не увидел на вашем сайте карусели.
Евгений
Приветствую. Чем можно сделать карусель из колонок?
Админ
День добрый. Из колонок по умолчанию ничем. Нужны более подробные примеры, возможно можно используя сторонние коммерческие плагины для элементора
Евгений
Нашел 2 плагина бесплатный Premium Addons for Elementor и платный где это можно сделать The Plus — Addon for Elementor Page Builder WordPress Plugi
Евгений
Охота самому содержимое карусели сделать. https://cloud.mail.ru/public/JZ4P%2FNMcpUAHnn
На десктопе она не нужна только на мобильнике.
Ислам
А нельзя ли для каждой картинки в каруселе назначить отдельную ссылку? «Ссылка слайда» не работает
Админ
Используйте другой виджет Медиа карусель https://blog.web5x.ru/media-karysel-widget-elementor-pro/
София
Вставляю Карусель в секцию, добавляю галерею, настраиваю лайтбокс.
Но когда уже на самой странице нажимаю на миниатюру — открывается изображение без возможности пролистывания, то есть чтобы от лайтбокса 1 изображения перейти к другому — нужно выйти обратно к странице с каруселью и нажать на следующее, а не просто пролистнуть дальше (хотя стрелки есть, но при наведении на них и нажатии — лайтбокс закрывается)
Админ
Данной проблемы в элементоре версии 2.9.7. не замечено. Проверил!!
Dmytro
Версия 3.4.8 проблема есть