I’m having major issues when trying to write custom HTML in WordPress. Every time I use the HTML editor, weird stuff happens that ruins my page. The main problems I’m running into are:
When I add line breaks between nested HTML elements, the inner elements just disappear and don’t show up on the page at all.
WordPress automatically inserts paragraph tags everywhere in my code, which completely breaks the layout and sometimes stops the page from loading.
This is really frustrating because I’ve never had these issues when coding regular HTML or working with other frameworks. Why does WordPress mess with my HTML code when I’m specifically using the HTML editor? Is there a way to stop it from automatically adding tags or changing my formatting?
this used to drive me nuts too, but I found this code snippets plugin that skips wp’s filter junk. you can add your HTML/CSS/JS directly without any changes. way easier than tampering with functions.php every time for clean code.
wpautop is definitely the problem, but don’t disable it globally. Instead, wrap your custom HTML in shortcodes or use [raw] tags if your theme has them. I’ve had better luck with Custom HTML widgets or the ‘Raw HTML’ plugin - you get way more control without messing up other content. Also, WordPress strips certain HTML elements for security, which might explain why your nested elements keep vanishing. If you’re doing complex layouts often, just create a child theme and add your HTML as template parts rather than fighting with the editor.
WordPress has this feature known as wpautop, which automatically converts line breaks into paragraph tags, disrupting your custom code significantly. I’ve encountered similar issues while creating layouts, and it can truly be frustrating. WordPress seems to assume that you want paragraphs everywhere, even in the HTML editor, leading to unexpected formatting. To address this, you can add remove_filter(‘the_content’, ‘wpautop’) in your theme’s functions.php file; however, proceed with caution as this changes the behavior site-wide. Alternatively, I would recommend using the Custom HTML block in the block editor, as it doesn’t auto-format your code. Also, try to avoid switching between visual and HTML modes in the classic editor because that can further complicate things.