Пример работы

Скачивание изображений по клику

Модификатор добавляет функцию скачивания изображений в блоке GL12 при клике по нему
Коллекция / Скачивание изображений по клику
1. Добавляем блок T123 и копируем в него код
Скопировать код для блока SV401
2. Для блока SV401 необходимо добавить в карточках текст для кнопки, например "Скачать изображение", скачивание будет происходить при нажатии на кнопку.
В блоке GL12 изображения скачиваются при клике на изображение.
Скопировать код для блока GL12
<!-- TS14 - Модификация для Тильды. Скачивание изображений по клику в блоке SV401 https://mod.tistols.com/download-images -->
<script>
document.addEventListener('DOMContentLoaded', function() {
  document.querySelectorAll('.t851__col').forEach(function(col) {
    var imageUrl = col.querySelector('.t851__bg').getAttribute('data-original');
    var button = col.querySelector('.t-card__btn');

    if (button && imageUrl) {
      button.addEventListener('click', function() {
        var xhr = new XMLHttpRequest();
        xhr.open('GET', imageUrl, true);
        xhr.responseType = 'blob';
        xhr.onload = function() {
          if (xhr.status === 200) {
            var blob = xhr.response;
            var link = document.createElement('a');
            link.href = window.URL.createObjectURL(blob);
            link.download = imageUrl.substring(imageUrl.lastIndexOf('/') + 1);
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
          }
        };
        xhr.send();
      });
    }
  });
});
</script>
<!-- TS14 - Модификация для Тильды. Скачивание изображений по клику в блоке GL12 https://mod.tistols.com/download-images -->
<script>
  document.addEventListener('DOMContentLoaded', function() {
    document.querySelectorAll('.t603__tile').forEach(function(block) {
      block.addEventListener('click', function() {
        var imageUrl = block.querySelector('.t603__blockimg').getAttribute('data-original');
        var xhr = new XMLHttpRequest();
        xhr.open('GET', imageUrl, true);
        xhr.responseType = 'blob';
        xhr.onload = function() {
          if (xhr.status === 200) {
            var blob = xhr.response;
            var link = document.createElement('a');
            link.href = window.URL.createObjectURL(blob);
            link.download = imageUrl.substring(imageUrl.lastIndexOf('/') + 1);
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
          }
        };
        xhr.send();
      });
    });
  });
</script>
Добавьте шаблон страницы к себе в проект.
  1. Нажмите на кнопку "Создать новую страницу"
  2. Пролистайте до конца
  3. В "Указать ID страницы" напишите номер 54478369
Вам также может быть интересно: