How to Fix Phantom DIVs in HubSpot's Rich-Text Editor
Summary: This article provides guidance on addressing the issue of phantom DIVs being inserted when editing copy in a module.
Understanding Phantom DIVs
Phantom DIVs are unwanted HTML elements that can appear in your content when using the rich-text editor in HubSpot. These DIVs can cause layout issues, such as modules growing uncontrollably.
Causes of Phantom DIVs
The most common cause of phantom DIVs is copying and pasting text from external sources. When text is pasted with formatting, the rich-text editor may generate additional DIVs to accommodate the formatting.
Solutions to Address Phantom DIVs
-
Paste Without Formatting: To minimize the occurrence of phantom DIVs, it is recommended to paste content without formatting. This can often prevent the rich-text editor from generating unnecessary DIVs.
-
Manual Removal: If phantom DIVs have already been inserted, you can manually remove them by:
- Enabling the "Show Blocks" option in the editor.
- Deleting the unwanted DIVs directly.
-
Submit a Bug Report: If you continue to experience issues with phantom DIVs, it may be beneficial to submit a bug report to the support team. When submitting a report, include the following details:
- A description of the issue and the affected module.
- Any changes that triggered the problem.
- Your theme version, device, and browser information.
- Page links where the issue occurs.
- Screenshots or video recordings demonstrating the issue.
Additional Support
Since the rich-text editor is a native HubSpot module, you may also consider reaching out to HubSpot support for further assistance and insights regarding this issue.
Conclusion
Phantom DIVs can be a frustrating issue when editing content in HubSpot. By using the paste without formatting option and manually removing unwanted DIVs, you can manage this problem effectively. For persistent issues, submitting a bug report or contacting HubSpot support may provide additional solutions.