Stand out from the crowd - Using Embedded Objects in Job Ads


Posted By: Thomas Shaw, 2:30pm Tuesday 17 August 2010

Have you ever wanted to add a video, slideshare presentation, a chat room or some other 3rd party media objects into your job ads? Nearly all job board software restricts the advertiser from placing HTML embedded code into job ads. So, wouldn't it be cool if you can just paste a URL and it automatically creates the embedded object without having the user copy and paste the code?

Have a look at an example I created. A standard job ad with links to 3rd party content, and a solution embedding the 3rd party content into the job ad.

Try this... Copy and paste a YouTube video URL into your LinkedIn status box. Wait a few seconds and it will automatically fetch the content.

It was late 2007 when SEEK added the ability for advertisers to add YouTube videos into job ads. Shortly after a number of other job boards added the YouTube functionality into their system.

Fast forward to 2010, and still job boards continue to restrict the creativity for advertisers to add dynamic content into their job ads.
You may have viewed web pages that have movies or animations that display within a portion of a Web page rather than in a separate application. Animation, audio, video, or other media that is displayed within a webpage is known as embedded objects.

Embedded objects allows the delivery of an integrated multimedia experience that appears seamless to the user. It is as easy as cutting and pasting blocks of code. Except, nearly all recruiters and advertisers I speak with have no idea about this. Actually, neither do most job boards!

oEmbed is a format for allowing an embedded representation of a URL on third party sites. The simple API allows a website to display embedded content (such as photos or videos) when a user posts a link to that resource, without having to parse the resource directly.

oohEmbed is an oEmbed compatible provider of HTML embed codes for various web sites.

If you have used Facebook or tried the LinkedIn example... chances are you have used the oembed script.

Technically, the LinkedIn and Facebook example use some sort of oEmbed functionality to process the embed request.
  1. The user pastes in a URL at which content is hosted.
  2. The system checks that URL to find the address of its oEmbed API via a LINK element in the document's HEAD. This step could be cached as the API location is unlikely to change often.
  3. The system does a GET to the oEmbed API, essentially asking "what is the content for this URL"?
  4. The system gets a JSON or XML response containing structured metadata for the item.
  5. The system formats the data however it deems appropriate.
oEmbed and oohEmbed scripts have been around for a while. But there are so many different websites offering embed scripts it's just too hard to keep up your own library.

Here is the solution. There is a new site called Embed.ly which has integrated with over 100+ different 3rd party content sites. With the number of sites Embed.ly supports and the speed in which we add them it becomes difficult for code libraries to keep up a regular expression of all the URLs Embed.ly supports.

The Embed.ly script allows you to limit the different types of media objects. In this example, I have only allowed YouTube, UStream, Blip.tv, Hulu, Vimeo, Slideshare & Scribe URLs to be automatically embedded.

All the advertiser needs to do is paste the URL anywhere in the job ad and the script will do the rest for you.




SCRIPT CODE

<script type="text/javascript" src="http://scripts.embed.ly/embedly.js"></script> <script type="text/javascript"> var embedly_maxWidth = 400; var embedly_maxHeight = 400; var embedly_urlRe = /http:\/\/(.*youtube\.com\/watch.*|.*\.youtube\.com\/v\/.*|youtu\.be\ /.*|.*\.youtube\.com\/user\/.*#.*|.*\.youtube\.com\/.*#.*\/.*|www\.ustream\.tv\ /recorded\/.*|www\.ustream\.tv\/channel\/.*|blip\.tv\/file\/.*|.*\.blip\.tv\ /file\/.*|www\.hulu\.com\/watch.*|www\.hulu\.com\/w\/.*|hulu\.com\ /watch.*|hulu\.com\/w\/.*|www\.vimeo\.com\/groups\/.*\/videos\/.*|www\.vimeo\.com\ /.*|vimeo\.com\/groups\/.*\/videos\/.*|vimeo\.com\/.*|www\.slideshare\.net\/.*\ /.*|.*\.scribd\.com\/doc\/.*)/i var embedly_method = 'replace'; var embedly_wrapElement = 'div'; var embedly_className = 'embed'; var embedly_addImageStyles = true; var embedly_cssSelector = 'a'; var embedly_not_cssSelector = 'a.noembed'; </script>