Return to previous page

Add custom shop loop for the “woocommerce_after_shop_loop_item” hook on elementor product archive

This topic has 10 replies, 2 voices, and was last updated 4 months ago ago by Luca Rossi

Anas

Participant

July 21, 2024 at 12:14

Hi there,

I have a custom code that need to be added to the woocommerce_after_shop_loop_item hook, but it doesnt show on the front-end. please advise.

thanks

#406155 Copied Theme version: 9.3.15

9 Answers
Luca Rossi

Support staff

July 22, 2024 at 06:52
Hi @Anas,

Please try adding this custom codes under functions.php file locates in your child theme:
```
add_action('woocommerce_after_template_part', 'n2t_woocommerce_after_shop_loop_item');
function n2t_woocommerce_after_shop_loop_item($template_name){
    if($template_name == 'loop/loop-end.php') {
	    echo 'Your custom code';
    }
}
```
Hope it helps!
#406232 Copied
Anas

Participant

July 22, 2024 at 18:30

Hi there, i have added this to the child theme functions but the custom snippet doesn’t show on the shop or archive pages. Please advise, i have provided the login

Please contact administrator
for this information.

#406410 Copied

Luca Rossi

Support staff

July 23, 2024 at 04:30

Dear Anas,

We hope this message finds you well.

We would like to inform you that the custom codes appear to be functioning correctly. We suspect that the issue may be related to the cache.

For your reference, we have attached a screenshot that illustrates the current status.

Thank you for your attention to this matter.

Best Regards,
8Theme’s Team

Files is visible for topic creator and
support staff only.

#406422 Copied

Anas

Participant

July 23, 2024 at 04:59

Hey luka,

Noted, it is shown only for the first product on the last row of each archive page but why it is not showing for the other products? I need this to be shown on all products. I have cleared cache and checked, same issue. Please clarify. Treat this as top urgent

thanks for your support,

#406426 Copied
Luca Rossi

Support staff

July 23, 2024 at 06:12
Hi @Anas,

If you want to add the custom code for each product, please try with this code instead:
```
add_filter('after_etheme_product_grid_list_product_element_title', 'n2t_after_etheme_product_grid_list_product_element_title');
function n2t_after_etheme_product_grid_list_product_element_title(){
    echo 'Your custom code';
}
```
Best Regards,
8Theme’s Team
#406433 Copied
Anas

Participant

July 23, 2024 at 08:19

Great, this works but i need to show it after and below the price, any advise? thanks

#406464 Copied
Luca Rossi

Support staff

July 23, 2024 at 08:26
Hi @Anas,

Please update the previous code to this:
```
add_filter('after_etheme_product_grid_list_product_element_title', 'n2t_after_etheme_product_grid_list_product_element_title');
function n2t_after_etheme_product_grid_list_product_element_title(){
    echo '<div class="custom-code">Your custom code</div>';
}
```
After that, add this custom CSS codes under XStore > Theme Options > Theme Custom CSS > Global CSS:
```
.etheme-product-grid-content {
    display: flex;
    flex-direction: column;
}

.etheme-product-grid-content .custom-code {
    order: 10;
}
```
Should you require further customizations, we offer specialized services which can be accessed here: https://www.8theme.com/account/#etheme_customization_panel.

Thank you for your understanding and cooperation.

Best Regards,
The 8Theme Team
#406467 Copied
Anas

Participant

July 23, 2024 at 08:29

Great, thank you for the quick support and quick replies. your support keep our projects going smoothly according to our timeline.

much appreciated Luca

#406468 Copied

Luca Rossi

Support staff

July 23, 2024 at 08:59

If you need anything else please let us know.

Best Regards,
The 8Theme Team

#406472 Copied
Tagged: add custom loop woocommerce, custom shop loop wordpress, elementor product archive customization, elementor woocommerce integration, shop loop hook customization, woocommerce after shop loop item, wordpress woocommerce templates
Viewing 10 results - 1 through 10 (of 10 total)

The issue related to '‘Add custom shop loop for the “woocommerce_after_shop_loop_item” hook on elementor product archive’' has been successfully resolved, and the topic is now closed for further responses

Add custom shop loop for the “woocommerce_after_shop_loop_item” hook on elementor product archive

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection