При нажатии на карусель изображений с лайтбоксом происходит переход к URL-адресу изображения и последующий показ лайтбок ⇐ Jquery

[Anonymous]

У меня есть веб-сайт WordPress, на котором я использую карусель изображений Elementor в теме Blocksy. Вот вариант, который я выбрал для изображений:

• Ссылка — Медиа-файл
  Лайтбокс — Да

Когда я нажимаю на изображение, сначала я перехожу к URL-адресу мультимедиа – /wp-content/uploads/image – и когда я возвращаюсь, Я вижу лайтбокс (по умолчанию в Elementor), открытый с полным изображением. экран.
Здесь, щелкнув изображение, я хочу просто открыть лайтбокс, не переходя по пути /wp-content/uploads/image. Как этого добиться?
Я попробовал запустить приведенный ниже jQuery, а также аналогичный PHP-код с помощью плагина WP Code Light.
В приведенном ниже коде: Я пытался предотвратить поведение тега привязки по умолчанию.
Но даже при этом URL-адрес мультимедиа открывается.

Код: Выделить всё

jQuery(document).ready(function($) {
// Ensure the script runs after the DOM is fully loaded
$('.carousel a').on('click', function(e) {
e.preventDefault(); // Prevent the default link behavior

// Get the href attribute of the clicked link
var href = $(this).attr('href');

// Ensure the lightbox plugin is available and has a method to open images
if (typeof $.featherlight === 'function') {
$.featherlight(href); // Open the lightbox (replace with the correct method if using another plugin)
} else {
console.error('Featherlight plugin is not loaded or available.');
}
});
});

Как мне решить эту проблему? Я могу использовать любую бесплатную карусель, если она не поддерживает просмотр изображения в полноэкранном режиме по клику.

Подробнее здесь: https://stackoverflow.com/questions/788 ... -showing-l