Add a carousel to the page… go to Advanced Settings… add a CSS Classes (ex. ‘carousel1’)
Add an HTML block to the same page and add:
<style>.swiper-slide-image{cursor: pointer;} </style>
<script>
document.addEventListener('DOMContentLoaded', function () {
/* Edit the links HERE */
let links = [
'https://hyperlink goes here',
/* Edit the links HERE */
let links = [
'https://hyperlink goes here',
/* End the hyper link series by removing the comma at the end */
];
/* add the CSS CLASS below... which will be 'carousel1' */
document.body.addEventListener('click', function (e) {
if (e.target.closest('.carousel1 .swiper-slide')){
let i = e.target.closest('.swiper-slide').getAttribute("data-swiper-slide-index");
if (links[i] && links[i].length > 2){
window.open(links[i]); /* TO OPEN LINKS IN SAME WINDOW USE: location = links[i]; */
}
}
});
});
</script>
/* You can add more than one carousel (with image links) by repeating this step and adding a new CSS Class and a new HTML block. Also two things, the carousel MUST be set to LOOP & the Link Setting for the carousel must be set to none; oh and if it doesn't work while logged in, view the page in Incognito */
I think that's it...