If you’ve ever tried to embed a Google Maps iframe inside of the WordPress WYSIWYG editor, you most likely have run into some issues, like for instance, the editor completely stripping your map code out. But don’t worry, there’s a great little plugin to help you fix this issue.
The plugin in question is called TinyMCE Valid Elements and by downloading and installing it, you can stop the WordPress editor from deleting your iframe code completely. Here’s a short guide:
- Download the plugin and upload it to your wp-content/plugins directory (you could also install through the WP dashboard’s native plugin installer)
- Once it’s been installed go to your “Tools” tab (the plugin’s site says to go to Manage, but for me it was inside of the Tools tab, I’m running WordPress v 3.0.4)
- Underneath “Tools” you’ll see link to the Tiny MCE Valid Elements plugin, click it.
- Once inside of the plugin’s config screen, you can add elements which you want WP to recognize as valid, thereby stopping it from deleting them from your posts. Add iframe.
- But you’re not done yet! You need to add the attributes of this element that you want WP to recognize as valid as well. For a Google Map, the attributes are: width, height, frameborder, scrolling, marginheight, marginwidth and src.
- Hit “ctrl + F5″ to refresh your cache and you’re done!
- Now you can go to the post or page containing the map and edit like there’s no tomorrow without fear of losing your iframe.
Hope that was helpful. Huge props to engfer for creating this awesome plugin.