[Resolved] Empty paragraphs inserted while using Toolsets + Beaver bulder

[Author]

Posts

[joostH-2]

I am trying to:

use Beaver Builder on a site that also uses Toolset

Link to a page where the issue can be seen: liefdebuitendelijntjes.nl/home (but this page is still behind an Under Construction page) I can create a temporary admin account if needed). But look at screenshot.

This part is build with Beaver Builder. You can see the white area indicated with the cyan circle. That does not belong there. This extra space is inserted after many elements, at least all after all rows and columns. I've had extensive discussions with the Beaver support about this. It turns out that every time an empty set of paragraphs tags <p></p> is added, see an example indicated with a cyan circle. Now the peculiar thing is that this ONLY happens when Toolset Views or Toolset Blocks is active. Disabling both resolves the problem. But, of course, that's not a real solution as I need either Views or Blocks.

This problems seems similar to this old one: https://toolset.com/forums/topic/content-template-adding-extra-p-and-br-tags-with-beaver-builder/ but I'm not actively using shortcodes and I can translate the solution to my situation.

Any suggestions how to resolve this?

Kind regards,

Joost

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

Hi Joost,

Thank you for getting in touch.

Try using this code to your site and it should work fine.

jQuery('p').each(function(index, item) {
    if(jQuery.trim(jQuery(item).text()) === "") {
        jQuery(item).slideUp(); // $(item).remove(); slideUp looks nicer
    }
});

This should be able to remove it for you.

Thanks,
Shane

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

Hi Josh,

Still looking on this for you to identify the exact issue but the workaround above should remove the empty P tags.

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

Hi Josh,

I took a further look at this for you. Currently I suspect that the issue is coming from the beaver builder template because even when I un-assign the page from the content template you have active on this page the issue still occurs.

Indeed as you say disabling the views plugin removes the empty p tag but I would need to get a copy of your site in order to perform a further investigation to pin point the exact issue.

I would need to escalate this thread if the issue is on our side.

Thanks,
Shane

[joostH-2]

Hi Shane,

Thanks for the quick reply. Indeed the JS workaround fixes the issue in the sense that the result looks OK. So for the moment I can proceed, but of course with the shaky feeling the issue could re-appear in some other form or on some other place.

The difficult situation is that issue occurs in an interaction between two plugins. Disabling Toolset Views fully resolves it and, as you point out, disabling it partially (by un-assigning the Toolset template, something I hadn't tried yet) does not.

I can confirm that BB support has already put in quite some time but could not trace it back to BB. What is that you need from my side to create the test copy to check if the issue is in Toolset? Would it be helpful if I put you in direct contact with my BB contact?

Regards,

Joost

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

Hi Joost,

What I would be doing is to install the duplicator plugin on your site to grab the copy.

Once i've found anything I will let you know.

Thanks,
Shane

[joostH-2]

Hi Shane,

That's OK. I already have Updraft Plus installed if that is of any help.

Thanks!

Joost

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

HI Joost,

I've made the copy of the site and managed to find where you had added the code I provided. I removed the code and noticed that the issue is no longer there.

I removed the code from Dynamik -> Custom -> JS

Was the code added somewhere else ? I would like to know because the empty p tags are no longer showing when I remove the code from here.

Please let me know.
Thanks,
Shane

[joostH-2]

Hi Shane,

I've been travelling a few days but picking up now.

You are correct on the location of the JS script. I have not put it elsewhere.

This is the akward part of the problem. I hoped that it was just a coïncidence on my part, and was not sure if I was imagining it. But apparently not. This problem seems to arise with some delay. Usually not immediately on a fresh page, but after some editing. For some time I thought it had to do with adding custom CSS classes to the page. But after a lot of testing, I could reproduce it without extra classes. I have no clue what this triggers. Perhaps you could try to make some repeated changes (+ saving) of that page and see if the problem arises?

I'm sorry for such a fuzzy problem. But I have already spent days on testing and debugging and this where I am now.

Joost

[joostH-2]

Hi Shane,

Perhaps this remark of BB support is of help:

this could be related to a WordPress Core issue mentioned here. https://core.trac.wordpress.org/ticket/40021
Can you also try the code below by adding to the active theme's functions.php file?
remove_filter( 'the_content', 'wpautop', 20 );

I just put the filter in the functions.php , and it has the same effect as your JS script. Pages look OK now.

Does that shine any light on the problem for you?

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

Hi Joost,

Actually this is the first i'm seeing the issue with BB and Toolset . As mentioned by the BB team its quite possible an issue with wordpress CORE as i've seen it with some other plugins where you get an auto paragraph generated.

Normally we have an inhouse solution for this as well.
https://toolset.com/documentation/user-guides/views/views-shortcodes/#vf-310704

The above shortcode will remove the auto paragraphs in the case where your content is generating an auto paragraph when it shouldn't.

Actually the better solution is to remove it using the Hook

remove_filter( 'the_content', 'wpautop', 20 );

Since the Javascript can fail in cases where there are other JS errors in the console, so I would recommend using the filter hook.

Thanks,
Shane