Issue with anchor in short description for the archive product page

  • Hello,
    I have an issue about how displaying the short description on archive page.
    I had code an action for add the short description to the shop page but if i used a link it’s break my code and add the opening anchor tag for products in the loop at the wrong place and 2 times.

    add_action('woocommerce_shop_loop_item_title', function() {
    echo '<div class="product_excerpt_archive"><a>bla</a></div>';
}, 15);

    I expected that in output :

    <li class="product type-product post-145 status-publish first instock product_cat-chambres virtual taxable purchasable">
    <a href="https://ecureuil.local/reserver/chambre-1/" class="woocommerce-LoopProduct-link woocommerce-loop-product__link">
       <img >
       <div class="product_excerpt_archive"><a>bla</a></div>
       <h2 class="woocommerce-loop-product__title">Chambre 1</h2>
    </a>
</li>

    But i have this result :

    <li class="product type-product post-145 status-publish first instock product_cat-chambres virtual taxable purchasable">
    <a class="woocommerce-LoopProduct-link woocommerce-loop-product__link">
         <img >
    </a>
    <div class="product_excerpt_archive">
        <a class="woocommerce-LoopProduct-link woocommerce-loop-product__link"></a> 
             <a>test</a>
    </div>
    <h2 class="woocommerce-loop-product__title">Chambre 1</h2>
</li>

    It’s like the function woocommerce_template_loop_product_link_open (hook on woocommerce_before_shop_loop_item) it’s call 2 times but with Xdebug, I go in juste one time.

    If you have an idea, thanks à lot.

    
### WordPress Environment ###

WC Version: 4.2.2
REST API Version: ? 1.0.8
WC Blocks Version: ? 2.5.16
Action Scheduler Version: ? 3.1.6
WC Admin Version: ? 1.2.4
Log Directory Writable: ?
WP Version: 5.4.2
WP Multisite: –
WP Memory Limit: 512 MB
WP Debug Mode: ?
WP Cron: ?
Language: fr_FR
External object cache: –

### Server Environment ###

Server Info: Apache/2.4.41 (Win64) PHP/7.4.1
PHP Version: 7.4.1
PHP Post Max Size: 8 MB
PHP Time Limit: 0
PHP Max Input Vars: 2500
cURL Version: 7.67.0
OpenSSL/1.1.1c

SUHOSIN Installed: –
MySQL Version: 5.5.5-10.4.10-MariaDB
Max Upload Size: 8 MB
Default Timezone is UTC: ?
fsockopen/cURL: ?
SoapClient: ?
DOMDocument: ?
GZip: ?
Multibyte String: ?
Remote Post: ?
Remote Get: ?

### Database ###

WC Database Version: 4.2.2

### Post Type Counts ###

attachment: 24
booking_buffer_freez: 52
customize_changeset: 10
nav_menu_item: 4
page: 10
post: 2
product: 12
revision: 486
shop_order: 22
shop_order_refund: 2
wcdp_payment: 4
wpcf7_contact_form: 1

### Security ###

Secure connection (HTTPS): ?
					Votre boutique n’utilise pas HTTPS. En savoir plus sur HTTPS et les certificats SSL.
Hide errors from visitors: ?

### Active Plugins (13) ###

Query Monitor: par John Blackbourn – 3.5.2
Availability Search Widget Add-on: par PluginHive – 1.0.4 – La version installée n’a pas été testée avec la version en cours de WooCommerce 4.2.2
Contact Form 7: par Takayuki Miyoshi – 5.1.7
Bookings and Appointments For WooCommerce Premium: par PluginHive – 1.5.4 – La version installée n’a pas été testée avec la version en cours de WooCommerce 4.2.2
Booking Cost Adjustment: par pluginhive – 1.0.0 – La version installée n’a pas été testée avec la version en cours de WooCommerce 4.2.2
Customise Minimum Booking Slots: par pluginhive – 1.0.2 – La version installée n’a pas été testée avec la version en cours de WooCommerce 4.2.2
WF Booking Custom: par William Fauré – 0.9.9 – La version installée n’a pas été testée avec la version en cours de WooCommerce 4.2.2
Acomptes WooCommerce: par Webtomizer – 2.5.18 – La version installée n’a pas été testée avec la version en cours de WooCommerce 4.2.2
WooCommerce E-Transactions Payment plugin: par E-Transactions – 0.9.8.6 – La version installée n’a pas été testée avec la version en cours de WooCommerce 4.2.2
WooCommerce PDF Invoices & Packing Slips: par Ewout Fernhout – 2.5.1
WooCommerce: par Automattic – 4.2.2
WordPress Importer: par wordpressdotorg – 0.7
WP Mail SMTP: par WPForms – 1.9.0

### Inactive Plugins (3) ###

Akismet Anti-Spam: par Automattic – 4.1.4
Participant based Discount Addon: par PluginHive – 1.0
WF Booking: par William Fauré – 1.0.0 – La version installée n’a pas été testée avec la version en cours de WooCommerce 4.2.2

### Dropin Plugins (1) ###

db.php: Query Monitor Database Class

### Settings ###

API Enabled: –
Force SSL: –
Currency: EUR (€)
Currency Position: right
Thousand Separator: 
Decimal Separator: ,
Number of Decimals: 2
Taxonomies: Product Types: external (external)
grouped (grouped)
phive_booking (phive_booking)
simple (simple)
variable (variable)

Taxonomies: Product Visibility: exclude-from-catalog (exclude-from-catalog)
exclude-from-search (exclude-from-search)
featured (featured)
outofstock (outofstock)
rated-1 (rated-1)
rated-2 (rated-2)
rated-3 (rated-3)
rated-4 (rated-4)
rated-5 (rated-5)

Connected to WooCommerce.com: –

### WC Pages ###

Base de la boutique: #6 - /reserver/
Panier: #7 - /panier/
Commander: #8 - /commande/
Mon compte: #9 - /mon-compte/
Conditions générales de vente et d’utilisation: ? Page non définie

### Theme ###

Name: StoreFront Child
Version: 0.0.9
Author URL: 
Child Theme: ?
Parent Theme Name: Storefront
Parent Theme Version: 2.5.5 – 2.5.7 est disponible
Parent Theme Author URL: https://woocommerce.com/
WooCommerce Support: ?
    • This topic was modified 4 years, 5 months ago by mamashi.
Viewing 2 replies - 1 through 2 (of 2 total)
  • jessepearson

    (@jessepearson)

    Automattic Happiness Engineer

    @mamashi Did you find a solution for this?

    I would expect this code:

    
add_action('woocommerce_shop_loop_item_title', function() {
    echo '<div class="product_excerpt_archive"><a>bla</a></div>';
}, 15);

    to first output the content from the woocommerce_template_loop_product_title function, which is the h2 and it’s contents.
    https://github.com/woocommerce/woocommerce/blob/4.3.2/includes/wc-template-functions.php#L1125

    After that, then your added div should be next. So like this:

    
       <h2 class="woocommerce-loop-product__title">Chambre 1</h2>
       <div class="product_excerpt_archive"><a>bla</a></div>
    Thread Starter mamashi

    (@mamashi)

    Hello,

    No solution for me. If i had a link in action in the loop title, the link with the class “woocommerce-LoopProduct-link woocommerce-loop-product__link” break first and it’s duplicate too.

    This is a exemple of my code.

    
        add_action( 'woocommerce_before_shop_loop_item_title', function() {
            $category_ids = wc_get_product( get_the_ID() )->get_category_ids();
        
            foreach ( $category_ids as $id ) {
                $category[] = get_term_by( 'term_id', $id, 'product_cat' );
                break;
            }
        
            if (empty($category)) {
                return;
            }
            echo '<p><a>' . $category[0]->name . '</a></p>';
        }, 15 );

    If i remove the HTML link tag like : ‘<p>’ . $category[0]->name . ‘</p>’;
    The output is good and is :

    
<li class="product type-product post-1278 status-publish first instock product_cat-chambres virtual taxable purchasable product-type-phive_booking">
   <a href="" class="woocommerce-LoopProduct-link woocommerce-loop-product__link">
      <img class="woocommerce-placeholder wp-post-image" >
      <p>Chambres</p> <!-- THIS IS MY OUTPUT -->
      <h2 class="woocommerce-loop-product__title">Cambre d’Aze</h2>
      <span class="price"></span>
   </a>
   <a class="button product_type_phive_booking add_to_cart_button">Reserver maintenant</a>
</li>

    If i add the link like in my code snippet, i have this output with bug :

    
<li class="product type-product post-1278 status-publish first instock product_cat-chambres virtual taxable purchasable product-type-phive_booking">
   <a href="" class="woocommerce-LoopProduct-link woocommerce-loop-product__link">
      <img class="woocommerce-placeholder wp-post-image" >
   </a> <!-- Th link bug and wrap just the img instead all content -->
   <p> <!-- This is my output -->
      <a href="https://ecureuil.local/reserver/cambre-daze/" class="woocommerce-LoopProduct-link woocommerce-loop-product__link"> <!-- This link is add too with no reason -->
      </a>
      <a>Chambres</a>
      </p><!-- /This is my output -->
      <h2 class="woocommerce-loop-product__title">Cambre d’Aze</h2>
      <span class="price"></span>
      <a class="button product_type_phive_booking add_to_cart_button">Reserver maintenant</a>
</li>
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Issue with anchor in short description for the archive product page’ is closed to new replies.