Single quotes are being converted to double quotes

Beaver Builder
1

I’m trying to add JSON within a data attribute of an HTML element using the text editor in Beaver Builder like so:

data-props='[{"name":"someName","value"},{"name":"anotherName", "value": "anotherValue"}]'

this works perfectly in the standard WordPress text editor. My JavaScript can parse out the JSON using jQuery just fine. However, the BeaverBuilder text editor converts the above into:

data-props="[{"name":"someName","value":"someValue"},{"name":"anotherName","value":"anotherValue"}]"

As you can see, the single quotes have been converted to double quotes and the double quotes have been escaped as ". JSON has to be use double quotes to be parsed correctly. Is there a way to turn this parsing off since this is not how the standard editor behaves?

2

Hi Sid,

Can you provide a screenshot of where exactly you’re attempting to add this code to, please?

All the best,
Danny

3

Hi Danny,
Screenshots below. It doesn’t show you much more than my code example above:

Here is what I enter into the text editor module:
input

And here is the text editor module again after I click save:
Output

As you can see, the single quotes were turned into double quotes and the encased double quotes were turned into ". This isn’t the behavior of the standard WordPress editor.

4

Hi Sid,

The Text module is actually performing correctly. Basically, I copied your code from your screenshot and added to the Text module, it worked. However, when I opened the Text module again to edit, it was active on the Visual editor tab and not the Text editor tab. This is the reason your code gets converted.

You can actually recreate this using the WordPress editor. Add your code to a page/post when the Text editor is active, save the changed. Then switch to the Visual editor and then back to the Text editor, you will see the same thing happens.

Therefore, to get around this, you will want to navigate to your WordPress Admin Dashboard > Users > Your Profile and disable the Visual Editor, which will also affect the Text module.

All the best,
Danny

5

Hi Danny,
I see what you mean. The visual editor does the change which is very annoying. Any idea what filter is doing that so I could try disabling it in code? Disabling the visual editor on a per user basis seems like opening the door to new users inadvertently breaking this. For now I’ve switched single and double quotes, which WordPress likes, and then use JavaScript to switch them back which the JSON parser likes. It works but feels hackish. Thanks for your help!

6

Hi Sid,

I did some research for you and found a number of people asking something similar i.e. disable the visual editor for specific pages. There were a number of snippets, none of them worked when I just tested them. However, quite a few people mentioned this plugin - https://wordpress.org/plugins/disable-visual-editor-wysiwyg/

Maybe, see if this does the job for you?

All the best,
Danny

7

Thanks!

8

No problem, Sid. Alternatively, you could try placing that code via the HTML module.

All the best,
Danny