WordPress Removing Empty P Element’s Close Tag

January 21, 2012

Over the years, WordPress’s ability to convert text from the WYSIWYG editor into mostly valid HTML has largely improved, but it is still not perfect.

Recently, while setting up a somewhat creative FAQ page for a client, which uses the WordPress More Button to break up the different sections, I ran into an issue where WordPress was removing the closing tag from an empty paragraph.

Anyone who works with WordPress has likely run into similar issues as those described below and is probably well aware of this ‘fix’ or ‘work-around.’

WordPress’s content filters have, for the most part, significantly improved since the early days, as has TinyMCE. Even using the Visual section of the editor produces mostly acceptable html, so unless the page is doing some crazy stuff, clients are almost always able to edit pages using the visual section.

Of course, I typically avoid WYSWYG editors whenever possible, as they are far from perfect, but for non-techies, they have their place.

Problem and Solution

Essentially, after the Faq section title, I was using an empty <p> element to act as a divider between the Faq Question and the Answer.

During processing, I retrieved the un-modified content, processed it, then before printing it, used “apply_filters” to automatically add html to the content.

However, after using apply_filters, the closing tag of the <p> element was being removed.

As an aside, this is why you always run everything through w3c validation, even if there are some elements you know won't pass. At least for any sort of paying gig.

In any case, the fix is to add a Non-Breaking Space in between the empty paragraph, so something like <p>&nbsp;</p>.

About these ads

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

Join 45 other followers