Hello wpForo Support Team,
I'm experiencing a very persistent and frustrating issue with my forum's category descriptions, and I'm hoping you can provide some guidance.
Problem: When hovering over any of my forum category headers (the main category blocks, e.g., the div with class="wpforo-category"), an unwanted tooltip appears. This tooltip displays the raw HTML content of the category description (e.g., <p>Your description here</p>) instead of rendering as formatted text or being hidden entirely.
Observations from Browser Inspector:
-
The div.wpforo-category element itself has a title attribute that contains the full, escaped HTML of the category description.
-
Upon hovering, a separate, dynamically created div with the class wpf-tooltip appears, and this is the element displaying the raw HTML.
Troubleshooting Steps I've Already Exhausted (Unsuccessful):
-
wpForo Settings Review:
-
I've thoroughly checked all available settings under Forums → Settings (including Display Components, Display Forums, Features, SEO, Colors & Styles). I could not find any direct option or checkbox to disable this specific tooltip behavior or prevent HTML from being included/escaped in the title attribute for category descriptions.
-
-
Custom CSS Interventions (via Forums → Settings → Colors & Styles → Custom CSS Code):
-
I attempted to suppress the tooltip using pointer-events: none !important; on the .wpforo-category[title] selector. This did not work.
-
I tried more aggressive CSS (e.g., visibility: hidden !important;, opacity: 0 !important;) on broader selectors like #wpforo-wrap [title]. This did hide the tooltip, but unfortunately, it also hid essential elements like my category titles and breadcrumbs, indicating over-targeting.
-
I then specifically targeted the identified tooltip element .wpf-tooltip with display: none !important;, visibility: hidden !1important;, and opacity: 0 !important;. This also did not work; the tooltip continued to appear.
-
-
Custom JavaScript Interventions (via Code Snippets plugin, Site Wide Header location, JavaScript type):
-
I implemented JavaScript to attempt to remove the title attribute from .wpforo-category elements. This script was executed immediately on page load, on DOMContentLoaded, and included a setInterval (every 500ms) to repeatedly remove the attribute. It also used a MutationObserver on #wpforo-wrap to watch for childList and attributes changes (including title, style, class) and re-run the removal function. Result: All JavaScript attempts to remove the title attribute were unsuccessful; the tooltip continued to appear.
-
I then implemented an even more aggressive JavaScript solution to directly hide the identified .wpf-tooltip element. This script used element.style.setProperty('display', 'none', 'important'); (and visibility, opacity) to apply high-precedence inline styles. It combined this with a MutationObserver on document.body and a very aggressive setInterval (every 100ms) to constantly re-apply these inline styles. Result: This also proved unsuccessful; the tooltip remains visible.
-
Current Status: Despite these extensive and aggressive efforts in both CSS and JavaScript to either remove the title attribute or hide the wpf-tooltip element, the raw HTML tooltip continues to display on hover. This is occurring even when the category descriptions are entered as plain text in the wpForo editor (it seems wpForo converts them to HTML internally and then escapes that HTML for the title attribute).
This behavior is highly unusual and suggests a very specific, deeply embedded mechanism within wpForo (or a conflict with my theme/another plugin) that is overriding standard web development controls.
Request for Assistance: Could you please provide guidance on a definitive solution for this issue? Is there a known bug, a specific setting I'm missing, or an alternative method to prevent this raw HTML tooltip from appearing?
Thank you for your time and assistance.
Sincerely,
Linda