Contact Forms with Columns include Empty Paragraphs

[amst_ws]

When making Contact Forms (using Contact Form 7) with multi-column layouts (using X shortcodes) such as the following:

They are not output correctly in Cornerstone, nor on the frontend:

But this issue does not occur when using the Contact Form 7 Gutenberg block or when using the Gutenberg Shortcode Block:

Looking into the HTML, I see that empty paragraphs are output when only when using Cornerstone:

So I looked at the code of the Gutenberg Blocks, and it looks like the output is passed through a function called wpautop (I suppose it’s pronounced WP Auto P, see here), which strips empty paragraphs (<p></p>) from the output. So the solution for X/Pro is to use this function as well, or just strip empty paragraphs manually.

[christian]

Hey @amst_ws,

WordPress will replace spaces under a shortcode with an empty paragraph so you must write like this

[column]...[/column][column]...[/column]

Not:

[column]...[/column]

[column]...[/column]

That has been the way to write shortcodes until now. That is why the builder’s generated shortcodes is not “clean” or readable because of wpautop

Hope that helps.

[amst_ws]

Interestingly enough, I’ve never had this issue until Contact Form 7 5.4.

You’re correct though that adding the column shortcodes on the same line does fix the formatting. But even still, the output contains some empty paragraphs. It’d be nice if X/Pro could strip these because editing a form where all the shortcodes are on one line can be challenging. The one I posted here was just an example, but I have some more complex ones that I would certainly not like to condense to one line.

[tristup]

Hi @amst_ws,

As my colleague says that the spaces are converted to p tag by WordPress itself and how the builders react with it. I would request you to follow the process explained by my colleague for now, and will check and if possible will make a feature request so it might be taken into account in the future.

Thanks

[amst_ws]

For now I am stripping them myself. I just think it would be good to be consistent with Gutenberg’s behaviour (since it’s the default editor on WordPress now).

Thanks!

edit: Here is the exact line in wpautop where empty paragraphs are stripped.

[prakash_s]

Hello @amst_ws,

Thanks for the information. Please let us know if you need any further help on this.

Have a great day!
Thanks