WooCommerce Field Tooltip & Help Icon

Introduction

The Tooltip / Help Icon adds a small “?” icon next to a field’s label. When the customer hovers over it (or focuses it with the keyboard), helpful text appears.
It’s a clean way to add guidance without cluttering the product page.

This guide is customer-focused and explains each setting in simple language, with practical examples.


What Is the Tooltip / Help Icon?

It is a per-field Help Text option in Extra Product Options for WooCommerce. When you fill it in, a “?” icon appears beside the field label and reveals the text on hover or focus.

Common use cases:

  • explaining what a field is for
  • giving format hints (e.g. “Enter your phone with country code”)
  • clarifying pricing or options

Where to Configure the Help Icon

Go to: WP Admin -> WooCommerce -> Extra Product Options -> Addons Builder

Edit any field, open the General Settings tab, and fill in the Help Text box.


Quick Setup (Step by Step)

  1. Edit any field in your addon.
  2. Open the General Settings tab.
  3. Type your guidance into the Help Text box.
  4. Leave it empty to hide the icon.
  5. Save addon and test on frontend.

Help Text Options Explained

  • Help Text: the message shown in the tooltip. Basic HTML (bold, italic, links, line breaks) is allowed.
  • Empty: leaving it blank hides the “?” icon completely.

Frontend Customer Experience

  • a “?” icon appears next to the field label
  • hovering or focusing the icon shows the help text
  • fully keyboard-accessible and screen-reader friendly

How It Works


Best Practices

  • Keep help text short and specific.
  • Use it for format hints and clarifications, not long paragraphs.
  • Only add help text where it genuinely helps — empty boxes hide the icon.

Troubleshooting

The “?” icon does not appear

  • Make sure the Help Text box has content and the addon is saved.
  • Clear caching so the latest styles load.

Conclusion

The Tooltip / Help Icon is a simple, accessible way to guide customers exactly where they need it — improving clarity and reducing support questions.


Related Resources

Frequently Asked Questions

Find answers to commonly asked questions about the Tooltip / Help Icon.

Still have a question?

If you have any other queries, feel free to reach out to us. Our knowledgeable team is here to help!