У нас есть сайт WooCommerce, на котором мы хотим позволить пользователям выбирать пользовательские параметры подписи после того, как они выберут макет базовой подписи.Мы используем наложения div, чтобы показать / скрыть различные опции, которые выбирает пользователь.Когда пользователь нажимает «добавить в корзину», мы хотели бы получить изображение div и использовать его в качестве изображения корзины и оформления заказа, а также показать его в электронных письмах с заказами.У нас есть метаданные, работающие для разных опций, но у нас возникают проблемы с тем, чтобы изображение проходило через процесс, используя woocommerce_cart_item_thumbnail
hook.
Ниже приведены основы того, что мы пытаемся сделать.
$('.woocommerce-product-gallery__image').prepend($('<div id="custom-overlay"></div>'));
$('#custom-overlay').prepend('<img class="img-option1" style="display:block" src="img-option1.png"/>');
$('#custom-overlay').prepend('<img class="img-option2" style="display:none" src="img-option2.png"/>');
$('#custom-overlay').prepend('<img class="img-option3" style="display:none" src="img-option3.png"/>');
$('#custom-overlay').prepend('<img class="img-option4" style="display:none" src="img-option4.png"/>');
=====================
add_filter( 'woocommerce_cart_item_thumbnail', 'custom_cart_item_thumbnail', 10, 3 );
function custom_cart_item_thumbnail( $thumbnail, $cart_item, $cart_item_key ){
// should we use canvas.toDataURL at this point?
$thumbnail = '<img src="contents of custom-overlay div" />';
return $thumbnail;
}