Помогите пожалуйста со cлайдом (wordpress)

Здравствуйте нужна помощь со слайдом , wordpress выдает ошибку на строках

 showSlides(1, i);  и  x[slideIndex[no] - 1].style.display = "block";

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596

 // Массивы для 5 слайдеров  
var slideIndex = [1, 1, 1, 1, 1];  
var slideId = ["mySlides1", "mySlides2", "mySlides3", "mySlides4", "mySlides5"];  
// Инициализация всех слайдеров  
for (let i = 0; i < slideId.length; i++) {  
  showSlides(1, i);  
}  
 
function plusSlides(n, no) {  
  showSlides((slideIndex[no] += n), no);  
}  
 
function showSlides(n, no) {  
  var i;  
  var x = document.getElementsByClassName(slideId[no]);  
  if (n > x.length) {  
    slideIndex[no] = 1;  
  }  
  if (n < 1) {  
    slideIndex[no] = x.length;  
  }  
  for (i = 0; i < x.length; i++) {  
    x[i].style.display = "none";  
  }  
  x[slideIndex[no] - 1].style.display = "block";  
}  
 
// Обработка кликов для всех слайдеров  
const slideshowContainers = document.querySelectorAll(  
  '[class^="slideshow-container-"]'  
);  
const cover = document.getElementById("zat");  
const modal = document.getElementById("modal");  
 
// Добавляем обработчики для всех слайдеров  
slideshowContainers.forEach((container) => {  
  container.addEventListener("click", (e) => {  
    if (e.target.tagName === "IMG") {  
      modal.src = e.target.src;  
      cover.style.display = "block";  
    }  
  });  
});  
 
// Закрытие модального окна  
cover.addEventListener("click", () => {  
  cover.style.display = "none";  
});  
// Массивы для 5 слайдеров  
var slideIndex = [1, 1, 1, 1, 1];  
var slideId = ["mySlides1", "mySlides2", "mySlides3", "mySlides4", "mySlides5"];  
// Инициализация всех слайдеров  
for (let i = 0; i < slideId.length; i++) {  
  showSlides(1, i);  
}  
 
function plusSlides(n, no) {  
  showSlides((slideIndex[no] += n), no);  
}  
 
function showSlides(n, no) {  
  var i;  
  var x = document.getElementsByClassName(slideId[no]);  
  if (n > x.length) {  
    slideIndex[no] = 1;  
  }  
  if (n < 1) {  
    slideIndex[no] = x.length;  
  }  
  for (i = 0; i < x.length; i++) {  
    x[i].style.display = "none";  
  }  
  x[slideIndex[no] - 1].style.display = "block";  
}  
 
// Обработка кликов для всех слайдеров  
const slideshowContainers = document.querySelectorAll(  
  '[class^="slideshow-container-"]'  
);  
const cover = document.getElementById("zat");  
const modal = document.getElementById("modal");  
 
// Добавляем обработчики для всех слайдеров  
slideshowContainers.forEach((container) => {  
  container.addEventListener("click", (e) => {  
    if (e.target.tagName === "IMG") {  
      modal.src = e.target.src;  
      cover.style.display = "block";  
    }  
  });  
});  
 
// Закрытие модального окна  
cover.addEventListener("click", () => {  
  cover.style.display = "none";  
});

Дополнен

functions.js?ver=6.8.1:54 Uncaught TypeError: Cannot read properties of undefined (reading 'style')
at showSlides (functions.js?ver=6.8.1:54:25)
at functions.js?ver=6.8.1:35:3

По дате

По рейтингу

andrey_martynyuk_1

Профи

2мес

Ты пытаешься инициализировать слайды до полной загрузки DOM. Пробуй, фикс нейросетка сгенерировала:

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283

 const slideIndex = [1, 1, 1, 1, 1]; // const вместо var 
const slideId = ["mySlides1", "mySlides2", "mySlides3", "mySlides4", "mySlides5"]; 
 
// ОБЕРНУЛИ ИНИЦИАЛИЗАЦИЮ В DOMContentLoaded для гарантии загрузки DOM 
document.addEventListener("DOMContentLoaded", () => { 
  // Добавили проверку существования элементов 
  for (let i = 0; i < slideId.length; i++) { 
    const slides = document.getElementsByClassName(slideId[i]); 
    if (slides.length > 0) { 
      showSlides(1, i); 
    } 
  } 
}); 
 
function plusSlides(n, no) { 
  showSlides((slideIndex[no] += n), no); 
} 
 
// ПЕРЕРАБОТАННАЯ ФУНКЦИЯ С ПРОВЕРКАМИ 
function showSlides(n, no) { 
  const x = document.getElementsByClassName(slideId[no]); 
   
  // Защита от отсутствия элементов 
  if (!x || x.length === 0) { 
    console.error(`Элементы с классом ${slideId[no]} не найдены`); 
    return; 
  } 
 
  // Корректировка индексов с учётом границ 
  if (n > x.length) slideIndex[no] = 1; 
  if (n < 1) slideIndex[no] = x.length; 
   
  // Дополнительная проверка границ (защита от -1) 
  const currentIndex = Math.max(0, Math.min(slideIndex[no] - 1, x.length - 1)); 
 
  // Скрываем все слайды 
  for (let i = 0; i < x.length; i++) { 
    x[i].style.display = "none"; 
  } 
   
  // Показываем текущий слайд с проверкой существования 
  if (x[currentIndex]) { 
    x[currentIndex].style.display = "block"; 
  } else { 
    console.error(`Слайд с индексом ${currentIndex} не найден`); 
  } 
} 
 
// ОБРАБОТКА КЛИКОВ (добавили делегирование событий) 
document.addEventListener('click', (e) => { 
  // Модальное окно 
  if (e.target.closest('[class^="slideshow-container-"] img')) { 
    const modal = document.getElementById("modal"); 
    const cover = document.getElementById("zat"); 
    if (modal && cover) { 
      modal.src = e.target.src; 
      cover.style.display = "block"; 
    } 
  } 
   
  // Закрытие модалки 
  if (e.target.id === 'zat') { 
    e.target.style.display = "none"; 
  } 
   
  // Обработка кнопок навигации 
  if (e.target.matches('.prev, .next')) { 
    const container = e.target.closest('[class^="slideshow-container-"]'); 
    const index = Array.from(document.querySelectorAll('[class^="slideshow-container-"]')) 
                     .indexOf(container); 
    if (index !== -1) { 
      plusSlides(e.target.classList.contains('next') ? 1 : -1, index); 
    } 
  } 
});
 
// ДОБАВИЛИ ОБРАБОТЧИК КЛАВИАТУРЫ 
document.addEventListener('keydown', (e) => { 
  const cover = document.getElementById("zat"); 
  if (e.key === 'Escape' && cover.style.display === 'block') { 
    cover.style.display = "none"; 
  } 
});