Para comenzar, agregue este código justo después del carrusel de imágenes de Elementor

Agregue este código en un elemento HTML, que se coloca justo después del elemento carrusel de imágenes.


¡Carrusel de imágenes de Elementor súper fácil en orden aleatorio! 1


<script>

(function(){

let parent = document.querySelector('.elementor-image-carousel');

let images = parent.children;

let frag = document.createDocumentFragment();

while (images.length) {

frag.appendChild(images[Math.floor(Math.random() * images.length)]);

}

parent.appendChild(frag);

}());

</script>


Sigue leyendo solo si tienes más de un elemento de carrusel en tu página. De lo contrario, ¡esto ya debería funcionar perfectamente!


------


Si tiene más de un elemento carrusel de imágenes Elementor en su página, asígnele un nombre de clase.

Asígnele un nombre de clase 'carousel1' y luego cambie esta línea en el código:


document.querySelector('.elementor-image-carousel');


a esto


document.querySelector('.carousel1 .elementor-image-carousel');


------


Si desea que otros carruseles de imágenes de Elementor en la página también sean aleatorios, duplique el código y ajuste los nombres de las clases.

Asígneles los nombres de clase 'carrusel2', 'carrusel3', etc.


Luego, duplica el código y agrégalo en un elemento html que esté justo después de cada uno de los elementos del carrusel que quieras aleatorizar.


Por último, simplemente ajuste la misma línea de código, con el nombre de clase que coincida con el carrusel que está justo encima del elemento HTML respectivo.


Por ejemplo, usted tendría esta línea para el tercer carrusel de su página.


document.querySelector('.carousel3 .elementor-image-carousel');



Fuente:

https://element.how/elementor-image-carousel-random/