У клиентов стоит variation swatcher под авторством WP ADDON, он позволяет создавать и переключать галереи для каждого цвета вариаций. Другие переключалки такого типа не делают новых мета-боксов для всех вариаций.
Тестовый торвар, над которым я провожу все эксперименты
Я с нуля не делал эту тему, так что критика что она кривая или джековоробейская - то не ко мне, я только делаю правки,и одна уже давно не дает покоя.
Вместе с переключалкой нужно чтобы работали и видеогалереи. И я пробовал плагины видеогалерей, и настолько хваленно-перехваленные woothumbs, и ДО меня пробовали, у всех одна проблема - в лучшем случае видео работают при загрузке страницы, а после переключения вариаций уже нет, в худшем работает или переключалка, или галерея.
Я вообще самым простейшим способом вставил видео - прицепился к альту определенной картинки, этого вполне бы для задачи хватило.
add_action( 'wp_footer', 'demolink_get_button' );
function demolink_get_button() {
global $post, $product;
$demo_link1 = get_post_meta( $post->ID, '_demo_link1', true );
if ( $demo_link1 ) {?>
<script>
jQuery('img[alt="Видео товара 1"]').each(function(){
jQuery(this).replaceWith( '<video alt="Видео товара 1" muted autoplay loop poster="https://thepim.ru/wp-content/uploads/2022/08/37762310-play-icon.png" style="max-width:100%;"><source src="<?php echo $demo_link1 ?>" type="video/mp4"></video>' );
});
</script>
<?php }
}
Я заметил, что дело в том, что при переключении цвета в теге img просто-напросто стираются атрибуты, кроме src, вот поэтому мой скрипт не работает - альта просто больше нет. Я пробовал прицепиться в скрипте вместо альта к src, но не цепляется
При загрузке страницы у картинок в слайдере куча всего - там и альт, и дата-атрибуты, и размеры, а как нажать переключалку - так только src
jQuery('img[src="https://thepim.ru/wp-content/uploads/2022/07/37762310-play-icon-112x150.png"]').each(function(){
jQuery(this).replaceWith( '<video alt="Видео товара 1" muted allowfullscreen autoplay loop poster="https://thepim.ru/wp-content/uploads/2022/08/37762310-play-icon.png" style="max-width:100%;"><source src="<?php echo $demo_link1 ?>" type="video/mp4"></video>' );
});
Перевешивал на клик по списку цветов ul.swatch__list.is-flex, поверочные алерты действуют на это событие, а этот скрипт нет.
Я вижу, где в теме задаются классы, но и они стираются при клике - так что трет их плагин.
Значит какие-то глобальные скрипты надо продублировать в скриптовый файл плагина?
Или если попроще - к чему можно прицепиться, чтобы просто запускалось видео при переключении? Или как добавить альт/id/что-то еще, делающее картинку уникальной после клика на переключалку?