HTML Javascript Adder

Posted Sunday, July 21, 2013 at 2:51 am in Help With Your Web Site

web-constructionI’ve had several requests from “more advanced” users on the iemajen WPMU network to allow embedding of javascript and iframe type codes.   I recently posted about Adding Paypal Buy Now buttons using the email URL from Paypal rather than the HTML embed code for websites.  As a workaround (because WPMU strips these codes from the editor), I wrote up quick fix so that process is simple; using Custom Fields meta data to dynamically add the button.  Read more about that here.
**Need something like this? Contact us to learn more.**

Gimme some embed love

It’s still necessary to embed code for too many reasons to name.  Everything from Google Maps and Eventbrite ticket widgets – embed code is a must have for some clients and a few voiced that they don’t want to bother me with adding it for them.  Most likely they don’t want to wait and if they are editing something at a time I’m not around to add it – well it doesn’t get added until it’s added…

The Solution and a Happy Face

frog closeup on whiteI recently tested a plugin that adds a widget allowing users to embed code.  I couldn’t just allow any user on any site to add embed code directly into a page for security reasons.  So I needed to allow the use on a per site and per user basis.  Embed codes like javascript for dynamic forms and embed code for videos or maps should be allowed. It needs to be simple…

Add Javascript & Iframe Code to Your Website

Like the name implies – you can add stuff like HTML javascript and other embed codes. Follow these steps and get your embed on.

Access your Widgets dashboard

After you login to your website, on the left menu under Appearance click Widgets.

Wordpress-widget

Select the HTML Javascript Adder widget

In this example I will select the HTML Javascript Adder widget, drag, and drop to a sidebar titled Contact.

Wordpress-widget-adder

Wordpress-widget-drag

Input your embed code and save

Once the HTML Javascript Adder widget is opened you can access the editor and options.  There are a few things to point out here; not all options available need to be used or set etc.  

  • Input a title if you want a title – putting a title adds a heading and this will display on the website.  If you don’t want the title to display on the website leave it blank.  This will allow you to input your code and only the code will render on the website.
  • Settings do not apply to most users –  In most cases you do not need to change anything here or be bothered with it at all.
  • Edit limitation? – Likewise, in most cases you do not need to change anything.
  • Keep it simple – While there are some nifty features at your fingertips, it’s very simple to add your embed code in three steps.

1. Paste your code.  

2. Save.  

3. Copy shortcode.

Simply paste your iframe or javascript, save your work, and copy the shortcode that is created upon save.

Wordpress-widget-enter

Wordpress-widget-shortcode

Paste your shortcode into any page or post – that’s it!

That should do the trick.  Now you don’t have to bother me anymore 🙂

**If you would like this feature enabled on your website please contact me**

Resources and references I found useful and THANKS