Display RSS Feed Icon in Category View

N2S · 2008-10-29 02:38:08

USES: display a simple rss icon next to the current category that the user is viewing.
SAVE AND UPLOAD: (upload as /img/cat_rss.png)

OPEN: /_templates/category.tpl

FIND:
		<h2>
					{$translations.category.jobs_for} {$current_category}</a>
		</h2>

REPLACE WITH:
		<h2 id="none">
					{$translations.category.jobs_for} {$current_category} <a href="{$BASE_URL}rss/{$current_category}/" alt="RSS Feeds for {$current_category}"/><img src="{$BASE_URL}img/cat_rss.png" border="0" alt="RSS Job Feed"></a>
		</h2>

OPEN: /css/screen.css

FIND:
a {color:#0099CC; background-color:transparent;text-decoration:none;}
a:hover {color:#0099CC; background-color:transparent; text-decoration:underline;}

ADD AFTER:
div#job-listings h2#none a:hover {background-color:transparent !important;} // no background color for rss category rss icon

(only tested in firefox. I dont really care about IE users. If it works in IE please post and tell us.)

DEMO:

Last edited by N2S (2008-10-29 03:51:52)

jobberboards.com · 2009-02-09 00:21:39

hey mate. it works in IE but not in my firefox for some reason can u help

nice addition.

jobberboards.com · 2009-02-10 13:49:45

any help with this... thanks

Chronos · 2009-02-10 19:03:31

Seems to work fine when I visit your site. Maybe some (ad-blocking) plugin hides the image or so?

jobberboards.com · 2009-02-12 01:10:47

thanks for the reply.

it seems your option to remove the hover over background blue color messed up the h2 tag.

when anyone hovers over my rss icon the background turns blue...anyway around this

Chronos · 2009-02-12 01:27:10

Only did a quick check on your CSS file, but the following seems to work:

#content a:hover {
background-color:#0099CC;
color:#FFFFFF;
padding:2px;
text-decoration:none;
}

change to

#content a:hover {
color:#FFFFFF;
padding:2px;
text-decoration:none;
}

evertsemeijn · 2009-02-12 02:11:32

You could also add a class to your feed icon. From that you can be more directive with the css. Instead of changing the hover state of all the links in #content you can specify only the hover state of the rss icon. So starting from step 1 paste

<h2 id="none">{$translations.category.jobs_for} {$current_category} <a href="{$BASE_URL}rss/{$current_category}/" alt="RSS Feeds for {$current_category}"/><img class="feed_icon "src="{$BASE_URL}img/cat_rss.png" border="0" alt="RSS Job Feed"></a></h2>

Notice the added class to the icon.

Your css than should be

a.feed_icon:hover {background-color:transparent !important;}

elgreco · 2009-02-12 15:42:34

for me it works like that:
in the template:

<div id="rss-feed">
<h2>
{$translations.category.jobs_for} {$current_category} <a href="{$BASE_URL}rss/{$current_category}/" alt="RSS Feeds for {$current_category}"/><img src="{$BASE_URL}img/cat_rss.png" border="0" alt="RSS Job Feed"></a>
</h2>
</div>

in css:

div#rss-feed a:hover { background-color:transparent !important;}

evertsemeijn wrote:

You could also add a class to your feed icon. From that you can be more directive with the css. Instead of changing the hover state of all the links in #content you can specify only the hover state of the rss icon. So starting from step 1 paste
<h2 id="none">{$translations.category.jobs_for} {$current_category} <a href="{$BASE_URL}rss/{$current_category}/" alt="RSS Feeds for {$current_category}"/><img class="feed_icon "src="{$BASE_URL}img/cat_rss.png" border="0" alt="RSS Job Feed"></a></h2>
Notice the added class to the icon.
Your css than should be
a.feed_icon:hover {background-color:transparent !important;}

jobberboards.com · 2009-02-13 03:11:57

excellent thanks. I opted for the last option. worked perfect

Chronos by the way I am very impressed with your site and theme? Do you plan to share the code

you can PM me if you want. thanks

Chronos · 2009-02-13 03:53:56

I won't be sharing the theme I'm currently using (I'd like to stay unique at some points), but I was planning to release 1~3 basic layouts to improve my skills a bit (and since all JB installs look very much alike, I suppose they'd be welcome). Any suggestions?

jobberBase Community

Announcement

#1 2008-10-29 02:38:08

Display RSS Feed Icon in Category View

#2 2009-02-09 00:21:39

Re: Display RSS Feed Icon in Category View

#3 2009-02-10 13:49:45

Re: Display RSS Feed Icon in Category View

#4 2009-02-10 19:03:31

Re: Display RSS Feed Icon in Category View

#5 2009-02-12 01:10:47

Re: Display RSS Feed Icon in Category View

#6 2009-02-12 01:27:10

Re: Display RSS Feed Icon in Category View

#7 2009-02-12 02:11:32

Re: Display RSS Feed Icon in Category View

#8 2009-02-12 15:42:34

Re: Display RSS Feed Icon in Category View

#9 2009-02-13 03:11:57

Re: Display RSS Feed Icon in Category View

#10 2009-02-13 03:53:56

Re: Display RSS Feed Icon in Category View

Board footer