Ранее мы делали урок по созданию слайдера изображений (https://t.me/openregsupport/71), но мы доработали код слайдера. Теперь вы можете добавлять изображение со ссылкой, а также отключать возможность скачивания и раскрытия слайдера на весь экран.Для того чтобы разместить слайдер, вам нужно в редакторе элемента в режиме "Исходный код" (<>) добавить следующий код:
<div style="width: 50%; margin: auto;">
<div class="js-custom-ui-slider" data-downloadable="true" data-fullscreen="true">
<img src="" alt="" width="100%" data-link="" />
<img src="" alt="" width="100%" data-link="" />
<img src="" alt="" width="100%" data-link="" />
</div>
</div>
📎 При необходимости вы, как и ранее, можете изменить размер слайдера. Для этого нужно в первой строке отредактировать значение атрибута "width", например, на "100%".
Для вашего удобства мы расписали изменения в коде:
Появились атрибуты data-downloadable, data-fullscreen и data-link.
📥 data-downloadable: возможность скачать изображение.
🖥 data-fullscreen: раскрытие слайдера на весь экран.
Данные возможности можно выключить, установив значение "false"
<div class="js-custom-ui-slider" data-downloadable="false" data-fullscreen="false">
🔗 data-link: укажите ссылку, при клике на изображение будет переход по указанной ссылке.
Атрибуты src, alt, title остались без изменений.Пример кода:
<div style="width: 50%; margin: auto;">
<div class="js-custom-ui-slider" data-downloadable="false" data-fullscreen="true">
<img src="/upload/uf/44d/eznyuvqspuw127etsvw9nq3bmnle3i6h/Foto.png" alt="Описание 1" width="100%" data-link="https://openregion.info/">
<img src="/upload/uf/f76/04edcv0snwwyn5k0tt0laqfjxs97vx48/Foto2.png" alt="Описание 2" width="100%" data-link="https://openregion.info/">
<img src="/upload/uf/5d1/d0ho5eo3qfi8ryk6kby57e1n418u19is/Foto3.png" alt="Описание 3" width="100%" data-link="https://openregion.info/">
</div>
</div>
Если у вас возникнут вопросы, обращайтесь в нашу техническую поддержку. Мы всегда готовы помочь!
С уважением,
команда технической поддержки «Открытый регион»
