Question

Доброго времени. Подскажите можно ли как то перенести с стандартного шаблона #1815 самый нижний слайдер на другой шаблон:

Answer 1

1. Прежде всего, в другой шаблон перенести код слайдера https://docs.google.com/document/d/16TZIqoACJI52Rp5o9l5GkTxuhwiVKYC_g3sCVhNBxeA/edit?usp=sharing
2. Далее скрипты

<script type="text/javascript">
$(function() {
    $(".owl-one").owlCarousel({
        loop: !0,
        margin: 0,
        nav: !1,
        dots: !1,
        autoplayTimeout: 5e3,
        navSpeed: 15e3,
        autoplaySpeed: 15e3,
        autoplay: !1,
        responsiveClass: !0,
        items: 1,
        dotsEach: !1,
        responsive: {
            0: {
                items: 1
            },
            600: {
                items: 2
            },
            700: {
                items: 3
            },
            961: {
                items: 4
            }
        }
    }), $(".owl-two").owlCarousel({
        loop: !0,
        margin: 0,
        autoplayTimeout: 15e3,
        smartSpeed: 500,
        responsiveClass: !0,
        items: 1,
        nav: !0,
        dotsEach: !1
    });
});
</script>
<script src="/.s/t/1815/owl.carousel.min.js"></script>

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

3. Стили https://docs.google.com/document/d/16I_KNrbSXqgja4hw2XjsBnC3Qk6n3KYUaSbO6lkqPkc/edit?usp=sharing

Comments

Не работают переключатели:

 

---

Пан Таврический,

Попробуйте так же подключить скрипт:

<script type="text/javascript" src="/.s/t/1815/modernizr-custom.js"></script>

---

Yuri_Geruk,

К сожалению не помогло.

---

Пан Таврический,

В общем, проверил все скрипты, для переноса слайдера в другом шаблоне должны быть лишь эти:

<script type="text/javascript">
$(function() {
    $(".owl-one").owlCarousel({
        loop: !0,
        margin: 0,
        nav: !1,
        dots: !1,
        autoplayTimeout: 5e3,
        navSpeed: 15e3,
        autoplaySpeed: 15e3,
        autoplay: !1,
        responsiveClass: !0,
        items: 1,
        dotsEach: !1,
        responsive: {
            0: {
                items: 1
            },
            600: {
                items: 2
            },
            700: {
                items: 3
            },
            961: {
                items: 4
            }
        }
    }), $(".owl-two").owlCarousel({
        loop: !0,
        margin: 0,
        autoplayTimeout: 15e3,
        smartSpeed: 500,
        responsiveClass: !0,
        items: 1,
        nav: !0,
        dotsEach: !1
    });
});
</script>
<script src="/.s/t/1815/owl.carousel.min.js"></script>

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

---

Yuri_Geruk,

Что я сделал не так? http://ecli.moy.su

---

Пан Таврический,

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

---

Yuri_Geruk,

Сейчас добавил, тепереча даже картинок нет

---

Пан Таврический,

<script src="/.s/t/1815/owl.carousel.min.js"></script> продублировали два раза, стили удалили к слайдеру)) Стили верните. С стилей это удалите:

<script type="text/javascript">
$(function() {
    $(".owl-one").owlCarousel({
        loop: !0,
        margin: 0,
        nav: !1,
        dots: !1,
        autoplayTimeout: 5e3,
        navSpeed: 15e3,
        autoplaySpeed: 15e3,
        autoplay: !1,
        responsiveClass: !0,
        items: 1,
        dotsEach: !1,
        responsive: {
            0: {
                items: 1
            },
            600: {
                items: 2
            },
            700: {
                items: 3
            },
            961: {
                items: 4
            }
        }
    }), $(".owl-two").owlCarousel({
        loop: !0,
        margin: 0,
        autoplayTimeout: 15e3,
        smartSpeed: 500,
        responsiveClass: !0,
        items: 1,
        nav: !0,
        dotsEach: !1
    });
});
</script>
<script src="/.s/t/1815/owl.carousel.min.js"></script>

там этого быть не должно, только стили.

---

Yuri_Geruk,

Плюс ко всему такая вот беда 

---

Yuri_Geruk,

Ну вот сейчас вроде все правильно сделал. Уже даже ближе к истине. Но кнопки все равно не отопрожаются. И мобильная версия корявая.

---

Пан Таврический,

Чтобы кнопки отобразились как положено, в стили допишите:

@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/materialicons/v50/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

---

Yuri_Geruk,

Ну вроде бы победили. Спасибо огроменное!!!