I build my proper shop with ecommerce, and I'm beginner in development, I know correctly the CSS/HTML but JS he's not my tea cup... Actually, I want to display some products randomly in my "no_product_found" page in woocommerce. When a customer come to a product that are out of the shop, or a empty subcategory, he display products randomly.
I have add this hook to my function.php file from my child template
add_action( 'woocommerce_no_products_found', 'show_products_no_products', 20 );
function show_products_no_products() {
echo '<h2 class="customnoproduct">' . __( 'Houston... On a un problème! </br>On a rien trouvé comme produits dans cette catégorie 👩🚀', 'north' ) . '</h2>';
echo do_shortcode( '[products orderby="rand" per_page="8"]' );
}
That's work properly and great, but my filter bar are always display!... I want to hide them, so I have create another function and call her directly in php.
On my function.php
function hidefilter_callback() {
?>
<script>function removeElement(thb-shop-filters) {
// Removes an element from the document
var element = document.getElementById(thb-shop-filters);
element.parentNode.removeChild(thb-shop-filters);
}</script>
<?php
}
add_action( 'myhelp', 'hidefilter_callback' );
and after always on the same function.php, create add_action.
add_action( 'woocommerce_no_products_found', 'myhelp', 30 );
function myhelp() {
do_action( 'wp_head','myhelp' );
}
I don't know if my javascript function is good...
But the function is displayed but not on the head of my page, I don't understand why ?
When I add my do_action( 'wp_head','myhelp' );
into my show_products_no_products hook, she appears but into my website... So the function don't run.
How I can fix this ?
Sorry for my english, I'm french and I made my best to write correctly! Thx for your help in advance!