How to Add Progress bar to Product Card With Elementor
How to Add Progress bar to Product Card With Elementor
[ad_1]
I’m working with ACF and Elementor. I created a shortcode that displays the progress of orders. It can be easily displayed on single product page, but How can I display it on product card below the title.
I’d love to know how you linked the progress of orders into a progress bar.. To be able to display the bar under the title you can use the woocommerce hooks..
I use this to display the ACF field “category_eta” after archive category titles.
I’d love to know how you linked the progress of orders into a progress bar.. To be able to display the bar under the title you can use the woocommerce hooks..
I use this to display the ACF field “category_eta” after archive category titles.
//ACF Add ETA To Category
add_action(‘woocommerce_after_subcategory_title’, ‘add_category_eta’, 10);
function add_category_eta($category) {
$term_id = ‘product_cat_’.$category->term_id;
$category_eta = get_field(‘category_eta’, $term_id);
// Output the “category_eta” if it exists
if ($category_eta) {
echo ‘<p>’ . esc_html__(‘Ships: ‘, ‘oceanwp’) . $category_eta . ‘</p>’;
}
}
Here’s a visual guide for wc hooks for single products: [https://www.businessbloomer.com/woocommerce-visual-hook-guide-single-product-page/])
You can also turn the script into a shortcode and use a pagebuilder to display the shortcode wherever you like.