in Elftronix

Free Easy Plugin! Add Javascript to WordPress Posts & Pages

In this guide, I will explain step-by-step, how to easily add Javascript snippets to WordPress posts & pages using the “Code Embed” WP plugin.

Toggle WPAutop

There are two ways around this. One is to use a plugin that disables the “wpautop” filter which is the culprit of messing up your Javascript code in the first place. If you insert the code directly to the content by using the visual ‘WYSIWYG’ editor (WordPress uses TinyMCE). Currently the best free plugin is Toggle wpautop, which gives you the ability to disable wpautop for each post/page individually.

Downside is that this prevents the whole filter functionality. Most likely messing with the layout. For example <p>, <br /> tags are no longer added to content.

Alternatively one could disable TinyMCE all together. There is an option “Disable the visual editor when writing” in profile settings.

Code Embed

In my opinion, this is by far the easiest way. The plugin creates shortcodes that are used to add blocks of Javascript code to the content. There was a slight learning curve, but nothing major. I will show you the steps by adding an eBay Partner Network geo-targeted link to a blog post as an example.

First I copied the generated Javascript code for the affiliate program link.

eBay Partner Network Link Generator

Then installed the “Code Embed” plugin for WordPress.

WordPress Code Embed Plugin Install

There will be a new set of options, change the shortcode: “%CODE%” used within the content to enable the code snippet or just leave the settings as they are.

Code Embed Options

To start using the plugin, you must enable the “Custom Fields” setting in the screen options of an old or new post/page.

Custom Fields Setting for Posts and Pages

Now we can see the new custom fields options below the post/page. The “Value” is the Javascript code in whole. What took me a while to figure out, is that the Name” must contain the “Identifier Format Keyword” set in the previous Code Embed settings page.

So if the keyword is CODE and you want the name to be 1EBAY. Then you must enter “CODE1EBAY” to the input box. Then just hit the Add Custom Field button.

Adding New Custom Javascript Code Field

Now by directly using the visual editor, we may add the shortcode “%CODE1EBAY%” to anywhere within the content and it will show that piece of code.

New Post with Javascript Shortcode

The above post will result to this.

Get me to eBay WordPress Page

Working nicely. A huge thanks to dartiss for this amazing & free plugin.

Care and share, let's call it fair! -David

Twitter Button Facebook Button Google Button LinkedIn Button

Write a Comment


    • Hi Edmar,

      I’m the author of the plugin. Make sure you named the custom field name CODE1 and that was saved correctly. Then, placing %CODE1% in your post should add the code, rather than display this error. Any further problems – please use the plugin’s forum on (I respond a lot quicker!).


      • Hello, for some reason ‘Custom Field’ is not available in my options. Could you advise. Also here is an example of code I wish to use:

        Would this work with the plugin?

        Many Thanks

        • Did you enable custom fields in the screen options of a post or page?

          To paste code to the comment box, please wrap the text like so:
          < !code>..code here..< !/code> (remove the ! marks)

          • I also do not have Custom Field as an option, under screen options. I use the Karma theme.