I’ve been working on a plugin and it needed to allow users to save html code as options. However while trying to do so, php (or WordPress) would automatically escape the submitted code with a backslash (\). I tried figuring out why and where it was happening and it turned out to be added right at the $_POST level! So nothing much left ave?
Well the solution is pretty simply, however humans have a habit of confusing themselves with complex logics most of the time!
This post is mainly meant to be a reminder for me for the future and for anyone who’s trying to fix the WordPress input backslash issue!
WordPress adding backshalsh to quote / double quotes in input values
Basically what was happening was that WordPress (or PHP, still not sure, didn’t check sorry!) was adding a backslash to the data submitted through the input field to the WordPress via POST method.
Check the image below to understand what’s going on: (ask me for explanation if it’s confusing!)
Now whats going on here is that I’ve echoed the array value of $_POST to see what gets submitted to WP database once I submit the options for the plugin.
You can see that I’ve tried to submit ” class=’ ” (not \’) but WordPress converts it into \’ for protecting! Well fabulous but the issue is that it keeps repeating it, again and again, and once again! every time you submit the form. Infact next time it escapes the backslash too along with the single quote (or double quote if you’re trying that) making it three backslashes and a single quote!
Anyway, I’ve tried these things and they “did not work” (pasting them here as a reference for “not to use it”. See what to do after this)
What did not work to stop WordPress from escaping single and double quotes in html code
Don’t waste your time playing with these:
- htmlspecialchars
- htmlentities
- htmlspecialchars_decode
- html_entity_decode
Or with these built in WordPress functions too:
- esc_html
- esc_attr
You might have tried playing with these already and failed! right? Now don’t get me wrong, they might be helpful for some situations, but in mine, they weren’t and probably not in yours too!
Another thing, couple of websites shared this which didn’t work either:
Code by Fearlessflyer.com (don’t know who he is! but anyway! – ya he, She can’t code, Nah! )
<?php
if ( get_magic_quotes_gpc() ) {
$_POST = array_map( 'stripslashes_deep', $_POST );
$_GET = array_map( 'stripslashes_deep', $_GET );
$_COOKIE = array_map( 'stripslashes_deep', $_COOKIE );
$_REQUEST = array_map( 'stripslashes_deep', $_REQUEST );
}
?>
This worked though: by Pinkishhue.com (name seems like girl, but please God NO! make him a boy :( ) But it gave help, which we’ll discuss in next section how to get it done.
<?php
$options = get_option('myplugin_options');
$mytextareaoption = $options['mytextarea-option'];
esc_html( $mytextareaoption );
echo stripslashes ( "{$mytextareaoption}" );
?>How to stop WordPress options adding backslash to single quote and double quote repeatedly in input box containing html code
Ok well the way to solve it, is, pretty simple. Use stripslashes function while echoing the value of the option in your input box! pretty simple, aye? NO! Keep reading.
If you needed to fix the single quote and double quote issue only in your WordPress options, being escaped repeatedly by a backslash on each save, then you’re done here, by simply adding “stripslashes” function on the input value field like this:
<input type="text" name="nab_ll_before" value="<?php echo stripslashes($nab_ll_before); ?>" size="20">
However if you are in a situation where you need to save some html code as a option for your WordPress plugin (or WordPress theme options for that matter) you need to escape the html too (I used esc_html – esc_attr works fine too however!).
Check this image and try to get an idea of how WordPress is using it to escape the html li code we submitted:
Here, what’s being submitted to WordPress is being shown in the input again. However you can see that the submitted data is still escaped (the value of nab_li_before in the array above is dot “.” as the code is being shown as html here) Inspect element function don’t show you original code, so don’t rely on it here!
View source for this part is (adding just for reference and history purpose, makeout the meaning yourself if you’re interested):
How to submit html code in WordPress options correctly
Here comes the final word. I’ll keep it concise and short!
In your WordPress plugin admin page input box, use stripslashes to strip any slashes (extra ones) from the value itself.
<input type="text" name="nab_ll_before" value="<?php echo stripslashes($nab_ll_before); ?>" size="20">
In your submit and save functionality, use esc_html to save the html code submitted in properly escaped format like this:
$nab_ll_before = esc_html($_POST['nab_ll_before']);
Oh and remember that when you’re echoing the value of this option where you need it on your theme or so, you need to add stripslashes there too to echo the html saved in that options value without escaping backslashes!
Plus, we need to use this function to convert the escaped html back to normal one too! Without this php / WordPress will simply show your submitted code as echoed (as it’s escaped so html markup won’t process it)
htmlspecialchars_decodeCheck this code for example to get the original html submitted to WordPress options:
$ourfinalcode = stripslashes(htmlspecialchars_decode(get_option('nab_ll_before')));Let me know if you’re having trouble understanding something or if you want me to fix / code it for you!