Перейти к содержимому
BIS Arts
  • Услуги
    • Создание сайта под ключ
    • Одностраничный лендинг-сайт
    • Многостраничный сайт
    • Интернет-магазин
    • Обслуживание и доработки сайта
    • Разработка логотипа
  • Уроки
  • Портфолио
  • Отзывы
  • Контакты
  • Услуги
    • Создание сайта под ключ
    • Одностраничный лендинг-сайт
    • Многостраничный сайт
    • Интернет-магазин
    • Обслуживание и доработки сайта
    • Разработка логотипа
  • Уроки
  • Портфолио
  • Отзывы
  • Контакты
Whatsapp Telegram-plane
+7(900)247-59-69
Главная / Уроки / Elementor / Крутой слайдер или карусель на Elementor

Крутой слайдер или карусель на Elementor

  • 24 января, 2021
  • Нет комментариев
Содержание

В бесплатной версии Elementor есть виджет для создания слайдера или карусели, но он очень примитивный. В этом посте я подскажу вам три способа, как можно сделать крутой многослойный слайдер на Elementor любой сложности. И главное, реализовать это можно как в бесплатном Elementor, так и в Elementor Pro.

При помощи этих способов можно делать сложные многослойные слайдеры с анимацией, кнопками и всем чем угодно.

Способ 1 - Слайдер из блоков на Elementor при помощи 2 плагинов

Суть этого варианта в том, что мы создаём каждый слайд, как отдельную страницу, используя все возможности Elementor. А потом из таких страниц-слайдов соберем уже слайдер.

Для этого способа нам понадобятся два плагина:

  • AnyWhere Elementor
  • Slides anythig

Они есть в репозитории WordPress, поэтому заходим туда и устанавливаем их.

После этого заходим в первый плагин и создаём первый слайд-страницу. Путь в меню - "AE Templates/Add new".

плагин для создания слайдера на Elementor

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

cозданиt слайдера на Elementor

Далее делаем необходимое количество таких страниц-слайдов, копируем их шорткоды и переходим к следующему плагину Slides anythig. Создаём новый слайдер - "SA Slides/Add new slider".

Вставляем в каждый слайд нужный шорткод. В настройках включаем поддержку шорткодов (смотри рисунок ниже). Ну и выставляем нужные настройки отображения, в зависимости от того, что мы делаем - полноразмерный слайдер или карусель.

карусель Elementor

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

слайдер с помощью Elementor

Способ 2 - Карусель и слайдер с помощью плагина Premium addons

Суть здесь та же. Сначала мы создаём отдельные страницы (секции), а потом собираем их в слайдер. Но этот вариант проще. В этом случае мы используем только один плагин Premium addons for Elementor. После его установки переходим на страницу, где нужно установить слайдер и добавляем виджет Premium Carousel.

Premium addons карусель

Далее в поле Templates выбираем наши сделанные странички и собираем слайдер.

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

Способ 3 - Слайдер из секций стандартными средствами Elementor Pro

Всё очень просто. Для этого мы будем использовать виджет "Карусель отзывов" из набора, доступного только в Elementor Pro.

Например, мы хотим сделать карусель из нескольких блоков с ценами, три из которых будут в видимой части экрана, а остальные будут перелистываться.

слайдер блоков с помощью Elementor pro

Для этого необходимо создать несколько нужных секций в Elementor и скопировать их шорткоды.

Далее переходим в "Карусель отзывов", создаём необходимое количество слайдов, удаляем там всю информацию и в поле с текстом вставляем шорткоды созданных секций.

Не пугайтесь, что в редакторе блоки отображаться не будут - во фронтэнде всё будет работать.

При такой реализации слайдера есть небольшой нюанс! Стили виджета карусели могут перебивать стили ваших созданных блоков, поэтому придётся поиграться с настройками виджета. Если вы хорошо знакомы с Elementor, то проблем у вас возникнуть не должно.

Добавить комментарий Отменить ответ

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

Категории
Сайтостроение
Сайтостроение
WordPress
WordPress
WooCommerce
Elementor
elementor
Дизайн
Монетизация
Монетизация
реклама
BIS Arts

Услуги по созданию и обслуживанию сайтов

  • Услуги
  • Портфолио
  • Отзывы
+7 (900) 247-59-69
пн-пт с 10:00 до 19:00
Whatsapp Telegram Envelope
Copyright © 2013 — 2025 BIS Arts
Политика конфиденциальности
  • Услуги
    • Создание сайта под ключ
    • Одностраничный лендинг-сайт
    • Многостраничный сайт
    • Интернет-магазин
    • Обслуживание и доработки сайта
    • Разработка логотипа
  • Уроки
  • Портфолио
  • Отзывы
  • Контакты
  • +7 (900) 247-59-69
  • Написать в Whatsapp
  • Написать в Telegram
Свяжитесь с нами
  • Позвонить
  • Написать в WhatsApp
  • Написать в Telegram
  • Написать письмо
Позвонить
Написать в WhatsApp
Написать в Telegram
Написать письмо