web-dev-qa-db-fra.com

Woocommerce - supprimer l’espace réservé par défaut pour l’image?

Comment puis-je afficher des images pour seulement certains éléments, mais pas pour d'autres?

Je travaille sur un menu de restaurant avec commande en ligne, affichant le menu de nourriture (produits woocommerce) avec des codes courts - par exemple. [product_category category = "starters" orderby = "date" order = "asc"] etc.

De nombreux articles ne nécessitent pas d'image, mais j'ai constaté que, si un produit ne possède pas d'image associée à celui-ci, woocommerce ajoute automatiquement un élément de remplacement déplaisant aux listes.

Je peux désactiver toutes les vignettes, mais j'ai toujours besoin d'une prise en charge des vignettes pour tous les produits nécessitant une image.

Si je supprime l'image d'espace réservé par défaut, elle est remplacée par le texte "espace réservé"!

Si je remplace leur paramètre fictif par un petit fichier .png transparent, il sera agrandi à la taille des pouces, créant ainsi un espace indésirable "manquant".

Aucune idée de ce qu'il faut essayer? Merci

post-thumbnailsplugins
1
speedypancake

woocommerce_template_loop_product_thumbnail est connectable, vous pouvez donc le remplacer par votre propre code. Chaque fois que vous voyez une fonction n'importe où dans un paramètre WordPress qui ressemble à ceci:

if ( ! function_exists( 'woocommerce_template_loop_product_thumbnail' ) ) {

/**
 * Get the product thumbnail for the loop.
 *
 * @access public
 * @subpackage  Loop
 * @return void
 */
function woocommerce_template_loop_product_thumbnail() {
    echo woocommerce_get_product_thumbnail();
}
}

la coche if ( ! function_exists('something' ) ) indique une fonction pouvant être connectée que vous pouvez remplacer en créant une fonction du même nom dans votre thème ou votre thème enfant.

La fonction de Woo affiche essentiellement la vignette si elle existe et l’espace réservé si ce n’est pas le cas. Il vous suffira donc d’éliminer cette partie dans votre propre version, comme suit:

function woocommerce_template_loop_product_thumbnail() {
    global $post;
    if ( has_post_thumbnail() )
          echo get_the_post_thumbnail( $post->ID, 'shop_catalog' );
}
6
helgatheviking

J'ai trouvé une réponse ailleurs http://www.peterrknight.com/woocommerce-tutorial-better-product-listings-for-imageless-products-part-1/ que j'inclus. Pourrait probablement être rangé ou simplifié, mais semble fonctionner parfaitement en supprimant l'espace réservé d'image par défaut pour les produits qui n'ont pas d'image:

function before_imageless_product() {
if( !has_post_thumbnail( get_the_id() ) ){
    remove_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_product_thumbnail', 10 );
    echo '<div class="no-image">';
}
}
add_action( 'woocommerce_before_shop_loop_item', 'before_imageless_product', 9 );

function after_imageless_product() {
if( !has_post_thumbnail( get_the_id() ) ){
    add_action( 'woocommerce_before_shop_loop_item_title',      'woocommerce_template_loop_product_thumbnail', 10 );
    echo '</div>';
}
}
add_action( 'woocommerce_after_shop_loop_item', 'after_imageless_product', 9 );
2
speedypancake