SearchBox

You can also choose to embed a Careerjet SearchBox into your website. This will allow your visitors to search for a job directly from your webpage without ever leaving your site. All you have to do is to customise it by following the simple steps below, and then copy and paste the given HTML codes onto your site. Now your website features a mini job search engine!

2	Test your SearchBox

Careerjet

Copy/paste the code below onto your site

<!-- Careerjet search box -->
<style>
div.cjsearchbox{ 
text-align: left ; 
border: 1px solid #919294; 
background-color: #FFFFFF ;
padding: 8px ; 
font-family: Arial, sans-serif, Sans-serif ; 
font-size: 13px ; 
color: #000000; 
width: 480px;
}

div.cjsearchbox a{ 
color: #198ADC ; 
}

div.cjsearchbox form.cjsearchform{ 
padding-top: 0px ; 
padding-bottom: 0px ; 
padding-left: 0px ; 
padding-right: 0px ;
}

div#cjSearchResult{ 
}

div#cjSearchResult p.topline{ 
font-size: 16px ; 
font-weight: bold ; 
margin-bottom: 8px ; 
margin-top: 5px ;
}

span.cjlabel{ 
font-size: 13px ; 
font-weight: bold ; 
color: #000000; 
}

span.cjlabelsmall{ 
font-size: 11px ; 
color: #000000; 
}

input.cjinput{ 
width: 90% 
}

input.cjbutton{  
font-family:  Arial, sans-serif, Sans-serif; 
}

div.cjjob{ 
margin: 0px ; 
margin-bottom: 10px ; 
overflow: hidden ;
}

div.cjjob p { 
margin: 0px ; 
}

div.cjjob p.jobtitle{ 
font-size: 14 ; 
font-weight: bold ;
}

div.cjjob .company{ 
color: #666666; 
}

div.cjjob .locations{ 
color: #666666;
}

div.cjjob .site{ 
color: #099E2D ; 
}

#search_box_tools span.button{
      float:left;
      background:url("http://www.careerjet.com/images/search_left_bx.gif") no-repeat left top;
      padding-left: 10px ;
      color:#666;
      position: relative;
      top: 1px;
}

#search_box_tools span.button input{
     float:left ;
      background:url("http://www.careerjet.com/images/search_right_bx.gif") no-repeat right top;
      background-repeat: no-repeat ;
      margin: 0px ;
      text-decoration:none;
      height: 28px ;
      border:none ;
      padding-bottom: 10px ;
      padding-left: 0px ;
      padding-right: 15px ;
	  color:#FFFFFF;
	  font-weight:bold;
}

</style>
<a name="cjsearchboxanchor"></a>
<div class="cjsearchbox">
<script language="javascript" type="text/javascript" src="http://www.careerjet.co.uk./partners/jssearchbox.html?n=7&nfr=1"></script>
<div style="text-align: left; padding-top: 8px ; padding-bottom: 5px ;">
<a target="_blank" href="http://www.careerjet.co.uk.">Careerjet</a>
</div>
</div>
<!-- end of Careerjet search box -->

Add this feature to Blogger and it will automatically match your blog's design.

Web Publisher

SearchBox

Customise your SearchBox

Test your SearchBox

Copy/paste the code below onto your site