Last Updated: September 7, 2017
Revision Update: I have updated the wording.
This tutorial was written using the following plugin Ultimate TinyMCE (It has now changed to WP Edit. The new plugin only works with WordPress 3.9 and above) which is maintained on a regular basis and supported very well, it provides some nifty tools for you to add many different videos and other codes.
Note: You should not be running your website with and old WordPress version. You should update to the latest version.
The browsers tested:
- IE 11, IE 10 and IE 9
- Google Chrome
- Microsoft Edge
Note: Always have the latest version of the browser installed. Make sure you clear your cache regularly. Make sure Java is updated.
- document.write = which will write the text to your post. The text that it will write is Hello World!.
Always edit or add the code using the Text editor. See image below.
Step 3 ) The following image you have switched back to the Text editor. This time you will notice some code added by WordPress, // <![CDATA[ at the beginning of the script and // ]]> at the end of the script.
Note: This above does not apply any more if you are running WordPress 4.6.1 and above.
Note: You can read more about this by clicking in the following URL Wikipedia CDATA.
Add iframe To WordPress Post or Page
Step 5 ) Copy and paste the iframe code you selected to your post or page through the Text editor by clicking on HTML tab. The editor will place the iframe in between < p > < /p > tag. See image below.
Using Ultimate TinyMCE.
Step 6 ) The following instructions are for those who want to use the plugin to add an iframe. Select the following icon and add your code, url and other settings you prefer. See images below.
Remember: You need to set up Utlimate TinyMCE and add all the tools you want to include in your wysiwyg editor especially the one used in this tutorial.
Step 6-a ) The image shows you what to select to proceed. Go to Insert -> Media.
Step 6-b ) The following image General allows you to set up the following options.
- Dimensions = choose whether you want to enable Constrain proportions or not.
Step 6-c ) The following image Embed allows you to paste the source code.
Step 6-d ) The following image Advanced allows you to set up the following options.
- Alternative source
- RawHtml Lets you use raw HTML or any other code in your posts. You can also disable smart quotes and other automatic formatting on a per-post basis.
In regards to Raw HTML has two versions, the free and Pro. The free version only works with the HTML editor, it is not not compatible with WYSIWYG editor. To use with the WYSIWYG editor you need to purchase the Pro version.
Important: As always one of my golden rules create a backup before you try any new plugin just in case it causes other issues.
I hope this helps you and puts you on the right track. If you need any help just leave a comment or send me an e-mail.
Come back for more information as I keep updating this post.