Woocommerce admin tooltip for a custom plugin

Question

I build my Woocommerce plugin and I need to put some content next to my inputs with tooltip. I found this function: wc_help_tip() from Woocommerce Docs but I don't understand, and doesn't work.

Here's my code:

<?php 
    $tip = "test";
    echo wc_help_tip($tip, false);
?>

When I debug with F12, I saw a span content:

<span class="woocommerce-help-tip" data-tip="test"></span> 

But nothing appears in frontend.

Any ideas to this? Or something else to put native tooltip of WordPress?

EDIT : I need to use it in a custom admin backend page hook not in front end nor woocommerce admin backend page

Answer 1

This function is made for backend…

Below you have an example that will output the tooltip in order edit pages:

// Displayed in Order edit pages below order details on top first column
add_action( 'woocommerce_admin_order_data_after_order_details', 'displaying_tooltip_in_order_edit_pages', 10, 1 );
function displaying_tooltip_in_order_edit_pages( $order ){
    ?>
        <p class="form-field form-field-wide wc-customer-custom">Some text with a tooltip <?php echo wc_help_tip("hello world"); ?></p>
    <?php
}

Code goes in function.php file of the active child theme (or active theme).

Tested and works.

So if you add some code to display some custom fields or content in woocommerce admin pages through hooks, you can add those tooltips with wc_help_tip() function