Для сайтов с большим количеством партнёрских товаров можно не загружать изображения на хостинг, а использовать фотографию по ссылке.
Плюс – экономим место на хостинге. Помните, что WordPress при загрузке изображения, создаёт от 3 и выше копий разных размеров. Это нужно для оптимизации загрузки изображений на различных страницах сайта. Используя внешнее изображение, вы не создаёте лишние копии.
Минус – адрес изображение со временем может измениться, поэтому нужно эту ситуацию отслеживать. Фото может быть удалено, переименовано, перенесено на другой адрес или по другим причинам.
Этапы работы:
- создаём произвольное поле, в котором будем хранить url изображения
- включаем сохранение информации в базу данных
- выводим изображение в карточке товара
- Добавим произвольное поле в “Данные о товаре” на вкладку “Основные”:
add_action( 'woocommerce_product_options_pricing', 'usota_add_to_products_external_image_url' );
function usota_add_to_products_external_image_url() {
woocommerce_wp_text_input( array(
'id' => '_external_image_url',
'class' => 'short',
'label' => 'Image URL',
'data_type' => 'url',
));
}
2. Включаем сохранение данных:
add_action( 'save_post_product', 'usota_save_external_image_url' );
function usota_save_external_image_url( $product_id ) {
global $typenow;
if ( 'product' === $typenow ) {
if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) return;
if ( isset( $_POST['_external_image_url'] ) ) {
update_post_meta( $product_id, '_external_image_url', $_POST['_external_image_url'] );
}
}
}
3. Выводим на странице товара. Также добавим Alt-текст для изображения.
add_filter( 'woocommerce_single_product_image_thumbnail_html', 'usota_public_image_external_image', 100, 2 );
function usota_public_image_external_image( $html, $post_thumbnail_id ) {
global $product;
if ( ! $product->is_type( 'external' ) ) return $html;
$external_image_url = get_post_meta( $product->get_id(), '_external_image_url', true );
if ( $external_image_url ) {
$alt_text = $product->get_title();
$html = '<div class="woocommerce-product-gallery__image--placeholder">';
$html .= sprintf( '<img src="%s" alt="%s" class="wp-post-image" />', esc_url( $external_image_url ), $alt_text );
$html .= '</div>';
} else {
$html = '<div class="woocommerce-product-gallery__image--placeholder">';
$html .= sprintf( '<img src="%s" alt="%s" class="wp-post-image" />', esc_url( wc_placeholder_img_src( 'woocommerce_single' ) ), esc_html__( 'Awaiting product image', 'woocommerce' ) );
$html .= '</div>';
}
return $html;
}
Конечно, это не закроет полностью вопрос по изображению для внешнего/партнёрского товара. Нам по-прежнему нужна миниатюра, чтобы показывать товар в категории, в админке или на других страницах сайта.
Но можно загрузить только уменьшенную копию. Этого будет достаточно, чтобы товары смотрелись красиво, но и фотографии много места не занимали.
Весь код полностью, чтобы сразу добавить в functions.php
/**
* Выводим изображение в карточке товара по внешнией ссылке
* для внешних/партнёрских товаров
*/
// Добавляем произвольное поле external_image_url в данные о товаре
add_action( 'woocommerce_product_options_pricing', 'usota_add_to_products_external_image_url' );
function usota_add_to_products_external_image_url() {
woocommerce_wp_text_input( array(
'id' => '_external_image_url',
'class' => 'short',
'label' => 'Image URL',
'data_type' => 'url',
));
}
// Сохраняем произвольное поле external_image_url
add_action( 'save_post_product', 'usota_save_external_image_url' );
function usota_save_external_image_url( $product_id ) {
global $typenow;
if ( 'product' === $typenow ) {
if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) return;
if ( isset( $_POST['_external_image_url'] ) ) {
update_post_meta( $product_id, '_external_image_url', $_POST['_external_image_url'] );
}
}
}
// Выводим external_image_url в карточке товара на месте изображения товара
add_filter( 'woocommerce_single_product_image_thumbnail_html', 'usota_public_image_external_image', 100, 2 );
function usota_public_image_external_image( $html, $post_thumbnail_id ) {
global $product;
if ( ! $product->is_type( 'external' ) ) return $html;
$external_image_url = get_post_meta( $product->get_id(), '_external_image_url', true );
if ( $external_image_url ) {
$alt_text = $product->get_title();
$html = '<div class="woocommerce-product-gallery__image--placeholder">';
$html .= sprintf( '<img src="%s" alt="%s" class="wp-post-image" />', esc_url( $external_image_url ), $alt_text );
$html .= '</div>';
} else {
$html = '<div class="woocommerce-product-gallery__image--placeholder">';
$html .= sprintf( '<img src="%s" alt="%s" class="wp-post-image" />', esc_url( wc_placeholder_img_src( 'woocommerce_single' ) ), esc_html__( 'Awaiting product image', 'woocommerce' ) );
$html .= '</div>';
}
return $html;
}
Сообщение WooCommerce – изображение по ссылке для внешних/партнёрских товаров появились сначала на Веб-студия Юсота.
Source: usota.ru woocommerce