Если ручками писать в Elementor, тогда можно сделать следующее. Определится для каких разрешений экрана будет выводится слайдер.
Через Elementor, можно создать отдельный блок с слайдером для мобильных устройств и применить к нему соответствующие CSS-правила.
Если лень разбираться, переходи в низ. Там есть простое решение.
Slider Revolution 6
Для этого выполните следующие шаги:
1. Создайте новый блок с элементом слайдера в Elementor.
2. Откройте настройки блока и перейдите на вкладку "Дополнительно".
3. В разделе "CSS-классы" добавьте класс "mobile-slider" (без кавычек).
4. Откройте файл стилей вашей темы WordPress (style.css или custom.css) и добавьте следующие CSS-правила.
Пример
CSS:
@media only screen and (max-width: 768px) {
.mobile-slider {
/* Ваши стили для мобильного слайдера */
}
}
Здесь мы применяем стили к элементу с классом "mobile-slider" только на устройствах с шириной экрана не более 768 пикселей (обычно это мобильные устройства). Внутри фигурных скобок вы можете указать нужные стили для мобильного слайдера.
Например, для того чтобы сделать слайдер вертикальным на мобильных устройствах, можно добавить следующие стили:
CSS:
@media only screen and (max-width: 768px) {
.mobile-slider {
flex-direction: column;
}
}
Эти правила сделают слайдер вертикальным на мобильных устройствах.
Также вы можете использовать другие CSS-свойства, такие как "display: none" для скрытия элементов на мобильных устройствах или "padding" для увеличения пространства между элементами в слайдере.
Да, если совсем все плохо тогда посоветую лучший слайдер для WordPress
Slider Revolution