Creating a Job Search Widget


Posted By: Thomas Shaw, 7:40pm Tuesday 22 September 2009

One of the easiest way to create, and distribute your own job search widget is through a simple JavaScript. Within this JavaScript, we can specify the widgets size and content that will be displayed to the end user.

Previously I have shown you some Examples of Job Search Widgets and let's not forget why we want to create a widget in the first place.

To increase the distribution and create loyalty within your user base. By displaying a widget on your website, you can provide your readers with jobs and content from your favorite job site.


I suggest using a JavaScript because we can centrally CONTROL and UPDATE the content displayed to the end user without having to get the publisher to update the websites code. You can also MEASURE and TRACK the performance of the affiliate network.

In this example, you will need to create 2 files. Note: This widget will be a set size of 250 x 250 using IAB Ad Unit Guidelines.

1. widget.js
2. jobsearch.html (or other file extensions aspx, php)

The code you need to use to try out this example (remember to replace the URL with your own) is..
<script type="text/javascript" src="http://www.recruitmentdirectory.com.au/images/blog/jobsearch_widget.js"> </script>
That’s it. You can centrally control what the widget displays and can update it anytime you want.

widget.js

document.write('<iframe frameborder="0" scrolling="no" marginheight="0" marginwidth="0" height="250" width="250" src="URL/jobsearch.html" style="border: medium none ;"/></iframe>');

jobsearch.html

<html> <head> <style type="text/css"> body { margin: 0px 0px 0px 0px;} </style> </head> <body> <table width="250px" height="250px" border="0" cellpadding="10" cellspacing="0"> <tr> <td valign="top" align="left">CREATE YOUR WIDGET HERE</td> </tr> </table> </body> </html>