Не работает слайдер bitrix

Не работает Energosoft Slider для Битрикс 1С

Доброго времени суток, Уважаемый Читатель!

Сегодня я порадую Вас несложным решением, которое, в дальнейшем, поможет остальным разработчикам оперативно и легко исправить недочеты, которые существуют в модуле для 1С Битрикс Energosoft.Slider!

Итак, проблема заключалась в том, что после установки, на битрикс 12.5.10, данного модуля проявлялись следующие баги:

  1. Исчезновение стандартного многоуровневого меню
  2. Не рабочая карусель (сам модуль)

Решение достаточно простое:

  1. Для того чтобы пофиксить меню вам необходимо просто еще раз его настроить! 🙂 Не известно как, но модуль сбрасывает настройки данного компонента. (переходим в режим правки, наводим на меню и нажимаем шестеренку)
  2. Для правильной работы карусели Energosoft Slider нужен jQuery, jQuery.Easing и jQuery.jCarousel. Я использовал последнюю версию jQuery и карусель не хотела работать. Я нашел последние версии jQuery.Easing и jQuery.jCarousel и заменил файлы в папке bitrix/js/energosoft/ с переименовыванием. (скачать файлы — energosoft.slider.js.fix). При этом в настройках модуля я ставлю галочки на подключении только jQuery.Easing и jQuery.jCarousel т.к. jQuery подключаю общий в шаблоне. Если вы подключаете его в компоненте, то обновите и jQuery в папке bitrix/js/energosoft/!

Ребята с поддержки так же рекомендуют убирать галочки в настройках главного модуля (Админ часть -> настройки -> Настройки продукта -> настройка модулей -> Главный модуль) с пунктов «Объединять CSS файлы», «Объединять JS файлы», но это не нужно, как показал опыт 🙂

Конечно, такой фикс не совсем корректный, т.к. при первом обновлении модуля файлы заменятся на новые, если разработчики, конечно, обновят компонент и заменят эти файлы, но к этому времени я думаю они прочтут либо эту статью, либо сами поймут причину всех невзгод. Более того! Если вы подключаете свой jQuery в шаблоне, то напоминаю о необходимости его подключать перед скриптами использующими библиотеку jQuery!

Читайте также:  Msi gf75 9rcx 407xru не работает камера

На чистой установке битрикса в header.php будет выглядеть так:

Обращаю ваше внимание на то что подключение jQuery идет перед подключение скриптов компонентов битрикса!

В целом мы получаем вполне рабочую карусельку 🙂 Если у вас появились вопросы — пишите в комментариях или в соответствующем разделе (Вопросы и ответы)
Удачного кодинга, господа и дамы!

Есть вопрос? Что-то не понятно в статье? Хочешь отблагодарить? Пиши комментарий!
Если тебе понравилась статья, а тем более если еще и помогла — поставь +1 и нажми «Мне нравится»!

Источник

BX.SidePanel.Instance

Класс — основной программный интерфейс для работы со слайдером. Является объектом-синглтоном.

Метод BX.SidePanel.Instance.open

Метод открывает в слайдере страницу с указанным адресом в параметре url. Возвращает true, если слайдер успешно открылся, иначе false.

Параметры

Параметр Описание Тип
url Адрес страницы, которая будет открыта в iframe’е слайдера. Для слайдеров со своим контентом (указана опция contentCallback) в этом параметре указывается уникальный идентификатор. string
options Коллекция опций слайдера. Все настройки являются необязательными.
  • contentCallback — Функция-callback, загружающая в слайдер произвольное содержимое. В первом аргументе принимает объект слайдера (экземпляр класса BX.SidePanel.Slider). Callback должен внутри себя:
    • Создать и вернуть промис ( new Promise(function(resolve, reject) <>) ).
    • Разрешить его ( resolve(content) ) с содержимым слайдера с содержимым слайдера (строка или DOM-элемент).
    • В случае ошибки сообщить об этом ( reject(error) ).
  • width — Максимальная ширина слайдера.
  • cacheable — Кешировать слайдер после закрытия. Если указано false, при закрытии слайдер будет автоматически уничтожен. По умолчанию true.
  • autoFocus — При открытии слайдера происходит автоматическая фокусировка на iframe’е. Это поведение можно отменить, если указать false.
  • allowChangeHistory — Менять адрес страницы на адрес открытого слайдера. По умолчанию true.
  • allowChangeTitle — Менять заголовок страницы на заголовок открытого слайдера. По умолчанию null. При не установленном значении (null), название страницы будет меняться, если у слайдера явно задан заголовок (опция title) или разрешена смена адреса страницы (allowChangeHistory).
  • Title — Заголовок страницы. Если не указан, значение берется из document.title.
  • requestMethod — Если параметр равен post, то в iframe’е слайдера страница загрузится HTTP-методом POST. Это может понадобится для передачи большого объема данных, так как HTTP-метод GET может привести к ошибке 414 Request-URI Too Large .
  • requestParams — POST-параметры передаваемые в запросе. Имеет смысл только при requestMethod=»post» .
  • loader — Идентификатор лоадера вида moduleId:loaderId или путь к svg-файлу.
  • data — Произвольный набор своих данных для слайдера, с которыми можно работать (чтение/запись/удаление) на всем жизненном цикле.
  • label — Опция задает настройки для внешнего вида лейбла («этикетки») слайдера. Объект вида:
  • animationDuration — Время анимации открытия/закрытия слайдера в миллисекундах.
  • events — Коллекция обработчиков событий.
Object

Примеры использования

Пример слайдера со своим содержимым и данными.

Открытие слайдера HTTP-методом POST.

Метод BX.SidePanel.Instance.bindAnchors(anchors)

Метод регистрирует правила обработки нажатия ссылок на странице.

Параметры

Метод Описание Тип
anchors Настройки механизма обработки нажатия ссылок.
  • rules — Массив правил. Каждое правило — объект со следующими ключами:
    • condition — Массив шаблонов (регулярных выражений) ссылок. Обязательный параметр.
    • options — Коллекция опций, с которыми откроется слайдер. См. BX.SidePanel.Instance.open.
    • stopParameters — Массив запрещенных параметров. Если адрес содержит хотя бы один из этих параметров, ссылка обработана не будет. Необязательный параметр.
    • handler — Функция-обработчик нажатия на ссылку. С помощью этого параметра можно переопределить поведение по умолчанию (открытие слайдера). Необязательный параметр.
      • event — Объект события нажатия на ссылку
      • link — Объект с данными ссылки:
        • href — Адрес ссылки.
        • target — Значение атрибута target.
        • anchor — DOM-объект ссылки (тег ).
        • matches — Массив с совпадениями групп регулярного выражения.
    • validate — Функция проверки корректности ссылки. Если возвращает false, ссылка обработана не будет. Необязательный параметр.
      • link — объект с данными ссылки.
    • allowCrossDomain Разрешить открывать ссылки с внешних сайтов. По умолчанию false.
    • mobileFriendly Обрабатывать ссылки в мобильных браузерах. По умолчанию false.
Object

Другие методы класса

Метод Описание С версии
Возвращает true, если слайдер отображается на экране.
Закрывает текущий слайдер на странице.
immediately Закрыть слайдер мгновенно, без анимации.
Закрывает все слайдеры на странице.
immediately Закрыть слайдеры мгновенно, без анимации.
Уничтожает слайдер на странице.
url Адрес страницы или идентификатор удаляемого слайдера.
Перегружает текущий открытый слайдер.
Возвращает текущий открытый слайдер (экземпляр класса [BX.SidePanel.Slider).
Возвращает слайдер (экземпляр класса BX.SidePanel.Slider) по указанному адресу или идентификатору.
url — Адрес страницы или идентификатор слайдера.
Возвращает слайдер (экземпляр класса BX.SidePanel.Slider) по окну iframe’а.
window — Объект окна iframe’а.
Возвращает список всех открытых слайдеров (массив экземпляров класса BX.SidePanel.Slider).
Возвращает закрытый слайдер (экземпляр класса BX.SidePanel.Slider). Object

Пользовательские комментарии

Мы будем рады, если разработчики добавят свои комментарии по практическому использованию методов системы.

Для этого нужно всего лишь авторизоваться на сайте

Но помните, что Пользовательские комментарии, несмотря на модерацию, не являются официальной документацией. Ответственность за их использование несет сам пользователь.

Также Пользовательские комментарии не являются местом для обсуждения функционала. По подобным вопросам обращайтесь на форумы.

Источник

Подключение слайдера через компоненту news.list

Вывел на странице слайдер (OwlCarousel2-2.3.4) через компоненту news.list (1С-Битрикс: Управление сайтом 18.0.2.). Подключаю в шаблоне шапки вот так:

При этом в браузере вижу, что скрипты подключаются:

Слайдер запустился, работает, но есть проблема:

При первой загрузке страницы или при ее перезагрузке в хроме с очисткой кэша (ctrl + shift + R) грузится только первая картинка слайдера в уменьшенном виде — скрин1.

Если далее просто перегрузить страничку (не жестко), все отображается и работает корректно. Но это уже потом, а если с очисткой кэша — все повторяется.

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

Ничего не меняется.

Тогда в виде эксперимента поставил брейкпоинт в виде скрипта-заглушки в самый конец страницы — скрин2:

Так вот, при данной паузе (пока нажимаю продолжить выполнение скрипта) — страничка загружается до конца, этого времени в полсекунды хватает для того, чтобы все обработалось и отрисовалось корректно — скрин3:

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

Источник

Ссылка на слайдере

Здравствуйте, при работе возник вопрос
Можно ли навесить ссылку на слайдер?
Слайдер реализован средствами news.list

Должно выглядеть так: меняются картинки, на каждой из которых в одном месте текст с ссылкой на каталог.

Как можно сделать это в шаблоне компонента? Или есть способ сделать ссылку отдельно, присвоив ей только нужное место?

Цитата
Александр Фаст пишет:
В ИБ вместе с картинкой храните ссылку, в шаблоне прописываете ссылку.

Правильно ли я понимаю, что получится кликабельная картинка?

Если нет, то опишите, пожалуйста, подробнее.

Цитата
Александр Фаст пишет:
Да, на картинку или текст вешаете ссылку, я не вижу, как у вас реализован слайдер, поэтому конкретно куда что вставлять не скажу. Но логика такая, храните всю нужную информацию в ИБ вместе с картинками и правите шаблон уже для отображения, как вам нужно.

ну вот, делаете еще одно свойство адрес ссылки, тип строка, код BANNER_LINK

Возможно, в меня полетит тапок, но код шаблона выглядит так:

Цитата
Александр Фаст пишет:
ну тогда еще проще, оборачиваете тегом ссылки:

По-видимому этот кусок нужно вставить в шаблон, куда именно?

Что тут подразумевается под многоточием?

Цитата
Александр Фаст пишет:
стыдно такие-то вопросы уже задавать
Цитата
Александр Фаст пишет:
стыдно такие-то вопросы уже задавать

есть два способарешения
1 способ начните с азов самостоятельно проштудируйтете html css php. дольше по времени хотя бы понять синтаксис уйдет 2-3 дня а потом уже от практики зависит.
2. наймите кто сделает работу за вас.

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

Цитата
Якушев Даниил пишет: Как отменить действие изменения? Всё слетело после изменения шаблона
Цитата
Александр Фаст пишет:
http://www.codecademy.com/ вот могу посоветовать, для начала изучения, там и php и javascript и jquery есть.
Цитата
Александр Фаст пишет:
http://www.codecademy.com/ вот могу посоветовать, для начала изучения, там и php и javascript и jquery есть.

спасибо, с слайдером разобрался

Цитата
Александр Фаст написал:
ну вот, делаете еще одно свойство адрес ссылки, тип строка, код BANNER_LINK

в качестве движка слайдера используется
http://www.pixedelic.com/plugins/camera/ изучите его методы и примеры использования

Здравствуйте, при работе возник вопрос
Можно ли навесить ссылку на слайдер?
Слайдер реализован средствами news.list

Должно выглядеть так: меняются картинки, на каждой из которых в одном месте текст с ссылкой на каталог.

пример кода слайдера
?if(!defined(«B_PROLOG_INCLUDED») || B_PROLOG_INCLUDED!==true)die();
/** @var array $arParams */
/** @var array $arResult */
/** @global CMain $APPLICATION */
/** @global CUser $USER */
/** @global CDatabase $DB */
/** @var CBitrixComponentTemplate $this */
/** @var string $templateName */
/** @var string $templateFile */
/** @var string $templateFolder */
/** @var string $componentPath */
/** @var CBitrixComponent $component */
$this->setFrameMode(true);
?>

AddEditAction($arItem[‘ID’], $arItem[‘EDIT_LINK’], CIBlock::GetArrayByID($arItem[«IBLOCK_ID»], «ELEMENT_EDIT»));
$this->AddDeleteAction($arItem[‘ID’], $arItem[‘DELETE_LINK’], CIBlock::GetArrayByID($arItem[«IBLOCK_ID»], «ELEMENT_DELETE»), array(«CONFIRM» => GetMessage(‘CT_BNL_ELEMENT_DELETE_CONFIRM’)));
?>

GetEditAreaId($arItem[‘ID’]);?>»>

Источник

Оцените статью