By dfgfdgdfgdfg on

Is it possible in some way to add an icon next to or before the page title. The reason why I want to do this is because it will increase the usability and attractivity of the new website of Coccinella I am creating (it's a Jabber client). As you can see on the front page, there are currently three icons (Learn, View and Get). I would like to duplicate these icons in front of (or next to) the page title of the specific pages.

PS1: early feedback about the website is always welcome of course.

PS2: is there some talented designer who would like to contribute a sexy theme for the Coccinella website?

⋅ Categories: Drupal 5.x

Comments

vm’s picture

vm commented

I'd guess you have two ways to tackle this, the first way and probably the best way would be through the themes style.css.
search for title and add the necessary css to get titles to have an icon in line with them

or through the node.tpl.php whereby you can add your icon HTML preceeding the title.

I suggest the first method and doing it through .css

geekarena’s picture

geekarena commented

The CSS way:

Add a background image to that element in style.css. Like so (adapt per your own style sheet and theme):

background:url('icons/tag_red.png')  no-repeat 0 4px;
dfgfdgdfgdfg’s picture

dfgfdgdfgdfg commented

Yes, but I want to have multiple icons for diffrent pages (and not all pages will have their own icon, or maybe a default one). E.g. on the Screeshots page it will use the thumbnail-show.png icon, on the download page the kget.png icon, and on the About page the book.png icon.

dfgfdgdfgdfg’s picture

dfgfdgdfgdfg commented

Any idea?

dfgfdgdfgdfg’s picture

dfgfdgdfgdfg commented

Isn't it possible to tell Drupal this: I want image A for page X, image B for page Y, image C for page Z, and so forth? I'm still struggling with this :s

trentharlem’s picture

trentharlem commented

One way to "tell Drupal" how to do this ...

a. add a region to your theme above the content (where the title would be).
1. edit your themes ".info" file to include the new region
2. edit your themes page.tpl.php file to print the new region where you need it (and assign unique div id for css).
b. Create a block and put your icon/title image in it.
c. Config that block so that it only appears on the proper page in your new region.
d. Repeat a-c for remaining pages.

Another way would be to skip the block and add a background to the new div... If you go this route you will need a unique div id for each page/icon and therefore a unique page.tpl.php for each node (ie page-node-40.tpl.php).
Print the title inside a unique div. Then in your themes style.css file assign your icon as the background image. the edit your CSS to taste.

Yet another way would be to create a specific content type and an accompanying "node-type.tpl.php" file for each page that needs a unique icon.

trentharlem’s picture

trentharlem commented

more advanced version...

http://drupal.org/node/221854