Topic: Company Clouds on homepage (Top 20 Companies)
JOBBER VERSION: 1.5 beta 1 (20/08/2008)
FILES TO EDIT: page_home.php, /_templates/home.tpl, /css/screen.css
OPEN:page_home.php
FIND:
$html_title = $translations['homepage']['title'] . SITE_NAME;
$template = 'index.tpl';
AFTER ADD:
// begin cloud
$companies = array();
$sanitizer = new Sanitizer();
$sql = 'SELECT DISTINCT company FROM jobs WHERE is_temp = 0 AND is_active = 1 ORDER BY Rand() ASC LIMIT 20';
$comps = $db->QueryArray($sql);
foreach ($comps as $company)
{
$sql = 'SELECT COUNT(id) AS nr
FROM jobs
WHERE company = "' . $company['company'] . '"';
$nr = $db->QueryItem($sql);
if ($nr < 2)
{
$tag_height = 1;
}
else if ($nr >= 2 && $nr < 3)
{
$tag_height = 2;
}
else if ($nr >= 3 && $nr < 4)
{
$tag_height = 3;
}
else if ($nr >= 4 && $nr < 5)
{
$tag_height = 4;
}
else if ($nr >= 5 && $nr < 6)
{
$tag_height = 5;
}
else if ($nr >= 6)
{
$tag_height = 6;
}
$companies[] = array('name' => $company['company'],
'varname' => $sanitizer->sanitize_title_with_dashes($company['company']),
'count' => $nr,
'tag_height' => $tag_height);
}
$smarty->assign('companies', $companies);
$smarty->assign('companies_count', count($comps));
// end cloud
OPEN: /_templates/home.tpl
FIND:
{/if}
{if !$latest_jobs && !$most_applied_to_jobs}
BEFORE ADD:
<div class="companycloud">
<h3>Company Cloud</h3>
<p class="names">{section name=tmp loop=$companies}
<span class="company-tag-{$companies[tmp].tag_height}">
<a href="{$BASE_URL}jobs-at/{$companies[tmp].varname}/">{$companies[tmp].name}</a>
</span>
{/section}
<br />
</p>
<p class="clearfix viewmore"><a href="{$BASE_URL}companies/">View All →</a></p>
</div>
OPEN: /css/screen.css
ADD:
.companycloud{border:1px #eaeaea solid; /*margin-left:10px;*/ margin:20px 0 20px 10px; padding:10px;}
.companycloud h3{background:#f1f1f1 url(../images/bg.png) bottom repeat-x; display:block; font-family:Arial, Helvetica, sans-serif; padding:15px 10px; margin:0; font-weight:normal; color:#666; text-transform:uppercase; border-bottom:1px #ddd solid; font-size:1.2em; margin-bottom:20px;}
/* tag heights */
.company-tag-1 {font-size: 16px; !important}
.company-tag-2 {font-size: 18px; !important}
.company-tag-3 {font-size: 22px; !important}
.company-tag-4 {font-size: 26px; !important}
.company-tag-5 {font-size: 30px; !important}
.company-tag-6 {font-size: 34px; !important}
p.names a{color:#666;}
p.names a:hover{background:#555; color:#fff;}
p.viewmore a{margin-top:20px; background:#f1f1f1; padding:2px 5px; margin-left:00px; float:left;}
/* Auto Clearing Method ( Not for IE )
######################################## */
.clearfix:after
{
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
OUTCOME:
*thanks to flakdesign
HIS SIDEBAR DEMO: http://www.hireme.sg
(I did not add mine to the sidebar because It did not work for me. I think there was a css conflict, and I dont want to spend time on one small imperfection. So I therefore placed it on the bottom of the home page.)
*Having problems?
Notice that I said "BEFORE ADD" for one of the instructions. Go back and see if that may be the problem.*
Last edited by N2S (2008-10-28 02:26:11)
