[Resolved] WYSIWYG formatting

[Author]

Posts

[cassianS]

Hi guys,
I am having an issue with formatting of WYSIWYG field.
I enter a text and format it, but after review a post - text is parlty formatted and goes in one row.
When I activate a native WP theme - no issue. But I have an issue with a my theme. At the same time no errors in Google Chrome Dev Console.
Would you have any recommendation how to resolve this issue?

p.s. I Allowed saving unfiltered HTML in Types custom fields for users with higher roles

What is the link to your site?
hidden link

[Luo Yang]

Hello,

It seems your theme files is applying custom filters to WYSIWYG field.

If you are using Types shortcode [types] to render the WYSIWYG field in front-end, I suggest you try to add attribute suppress_filters="false" to Types shortcode. For example:
[types field="my-wysiwyg" suppress_filters="false"][/types]

More help:
https://toolset.com/documentation/customizing-sites-using-php/functions/#wysiwyg

'true' | 'false' (default)
If suppress_filters=’true’, all third party (non WordPress) filters hooked into the_content filter will be removed, when retrieving the WYSIWYG content.

[cassianS]

Thank you for your first reply. I've got a weird result:
I was implementing your suggestions on a staging website copy first and everything is fine: I get formatting and indents (the biggest issue).
It even works without suppress_filters="false".
I am confused because all settings and plugins are the same in the original website and staging copy...

[Luo Yang]

There might be some cache problem in your website, please check these:

1) Make sure you are using the latest version of Toolset plugins, you can download them here:
https://toolset.com/account/downloads/

2) In case it is a compatibility(cache) problem, please deactivate other plugins, and test again

[cassianS]

Hi Luo. Thank you
I have latest Toolset plugins' versions.
I cleared cache and deactivate cache plagin.

And now I have another funny situation:
I have two WYSIWYG feilds. And the first one doesn't have indents (paragraphs are not wrapped in <p> tag). But a second one has no problem. They both are identical and have same settings. I even deleted and created again the first WYSIWYG with an issue => still no indents.

[Luo Yang]

It seems to be a compatibility problem with your theme, since I don't have a your theme in my localhost, please provide a copy of your website in below private message box, also point out the problem page URL and field group URL, I need to test and debug it in my localhost. thanks

https://toolset.com/faq/provide-supporters-copy-site/

[Luo Yang]

Thanks for the details, I am downloading the files, will update here if there is anything found

[Luo Yang]

I have checked the single product post in front-end, for example:
hidden link

But can not find the problem you mentioned above:
hidden link

Please point out the problem page URL, where and how can I see the above screenshot? thanks

[cassianS]

Hi, you would need to delete a current text and enter a new one with indents just using the WYSIWYG editor.
In case of current products, they all were wrapped manually in html tags. But when you just using WYSIWYG editor, you can see that it doesn't wrap paragraphs in <p> tags automatically

[Luo Yang]

I assume we are talking about the custom field "Product Notes", I have tried it in your duplicator package, here are detail steps, please correct me if there is anything missing:
1) Edit product post "ALPINE K24"
fill some value into field "Product Notes", test this post in front-end, I can see the field value is wrapped with html P tag, for example:

<p>test 1234</p>

This HTML P tag is outputted by WYSIWYG field.

2) You can disable the HTML P tag, by this:
Edit the content template "Single Product":
hidden link

Edit the custom field shortcode from:
{!{types field='product-notes'  suppress_filters='true' output='normal'}!}{!{/types}!}

To:
{!{types field='product-notes'  suppress_filters='true' output='raw'}!}{!{/types}!}

And test again.

See our document:
https://toolset.com/documentation/customizing-sites-using-php/functions/#wysiwyg
output:
'raw' | 'normal'(default)
‘raw’=Display raw data stored in DB.

[cassianS]

Hi Luo, thank you. I very appriciate your help.
I probably had to specify field names when I was telling you that one WYSIWYG has issue and another - don't.

"Product Notes" WYSIWYG field has no issue, It wraps in <p> tag paraghraphs automatically. And that's what I need.

At the same time "Product Description" WYSIWYG field doesn't wrap text in <p> tag. And this feild has same settings as a "Product Notes".
I need "Product Description" WYSIWYG field wrap text in tags automatically. Therefore I need your with this

[Luo Yang]

Thanks for the details, it is a known issue of custom WYSIWYG field, see the errata here:
https://toolset.com/errata/paragraph-tag-is-stripped-in-wysiwyg-loop-items-and-page-builders-generated-content/
First WYSIWYG instance in a Content Template or Content Layout strips the paragraph tags.

So the workaround is:
Edit the content template "Single Product", use shortcode [wpv-autop] to wrap the first WYSIWYG field instance, like this:

{!{wpv-autop}!}{!{types field='product-notes' output='normal'}!}{!{/types}!}{!{/wpv-autop}!}

More help:
https://toolset.com/documentation/user-guides/views-shortcodes/#wpv-autop
This shortcode enables the auto-paragraph feature for content placed within it.

[cassianS]

My issue is resolved now. Thank you!