Now I’m not 100% why WordPress does this, but whenever you enter a script into a wordpress post via text mode and then switch back to visual mode, WordPress decides to change the code or remove parts of the code, why? I have no idea and I’m surprised this hasn’t been addressed already.
A great example of this can been be found if you followed my last tutorial on How to embed Facebook content with A WordPress post. Switching back to visual changes the code you paste in via text mode.
Youtube video link: How To Stop WordPress From Changing HTML Code
Stop WordPress From Changing The Code – How To Instructions
So for people who don’t like video tutorials here are my short text/image instructions, now please note this only works for people who have self-hosted wordpress sites and can install plugins.
Step 1: Locate and install plugin
Login to your wordpress admin area and via plugins, click add new. Via the search option you need to search for the following: “Custom Fields Shortcode” if you search the phrase without the S on the end of Fields, you may not see the correct plugin. The plugin author name is gonahkar http://wordpress.org/plugins/custom-fields-shortcode/
Install and activate the “Custom Fields Shortcode” plugin.
Step 2: Create a custom field
When editing or creating a post/page you should be able to scroll down and below the post editor you should see a section for creating “Custom Fields“, you may have to scroll past a few other available option if present.
If for some reason you do not see the custom fields option you’ll need to scroll to the top of the page and click on “Screen Options” a drop down menu will appear, put a check mark in custom fields. Now scroll down and locate the custom fields options.
So first we’re going to click on “Add New” and then enter in a custom field name, as seen in the video and picture, I’ve simply entered FB, short for Facebook. On the right we can enter the value, this is where we would paste in our script or code. Copy and paste in your code.
Once you’ve entered a name and value, press the “Add Custom Field” button.
Step 3: Inserting shortcode into post
So now that you’ve created a custom field, were now going to add a shortcode into the post so that we can call it load/display in the actually post/page.
FYI: Shortcode is very popular these days and used very often to insert and embed things into posts and pages via plugins.
What I recommend you do is first type out your post, add images images etc, then when you ready to insert your script or code that you just created using the custom fields you can enter the shortcode in the appropriate location.
Going off the video and the image posted above, the shortcode that I need to enter to get my Facebook script to work is as follows:
The cf is required every time as it’s what the plugin uses.
Note: you can enter the shortcode into a post or page via either the visual or text mode, but more importantly if you switch from one to another it does not break or alter anything. Any should you wish to edit the script or code, you can simply scroll down to the custom field, make the edit and press update field.
Credit goes out to Amit for originally showing me how to do this last year.
Did this help?
If this tutorial helped you or you have another option you’d like to share on stopping wordpress from altering the code then please share via a comment below. Also, if you need any help with something related to wordpress then feel free to ask for help.