Emo for category images

[PF]

Hi,

I would like to be able to put an emoticon beside each category title as opposed to covering the whole bar with an image.

Is that possible?

Thanks.

[Chris]

The category display name accepts BBCODE so you could use the IMG tag to place your emoticon next to the category name
(e.g. Category 3 [img src="http://images.proboards.com/blank.gif"]).
If you're after something else then please elaborate.

[PF]

Jul 27, 2014 3:08:42 GMT -8 Chris said:

The category display name accepts BBCODE so you could use the IMG tag to place your emoticon next to the category name
(e.g. Category 3 [img src="http://images.proboards.com/blank.gif"]).
If you're after something else then please elaborate.

Oh, I didn't know that. I'll try it.

Thanks!

EDIT: Hi Chris. I see how it's done now, but how do I place the emo on the corner of the bar? Right now, it appears above the title. I would like it to be on the side, not above.

Thanks.

[Chris]

PF, I didn't get a forum link so I could look to see what about your particular forum might have been changed so I am going to go ahead and assume you changed nothing :

There's a CSS rule that forces images in the title bar to display as block level elements, to override that rule you'll need to add a stronger rule commanding the image to ignore that other rule and and do its own thing.

Place the following at the bottom of your theme's advanced style sheet:

.title-bar.bbcode .title_wrapper img {
 display: inline;
}

[PF]

Jul 27, 2014 17:04:36 GMT -8 Chris said:

PF, I didn't get a forum link so I could look to see what about your particular forum might have been changed so I am going to go ahead and assume you changed nothing :

There's a CSS rule that forces images in the title bar to display as block level elements, to override that rule you'll need to add a stronger rule commanding the image to ignore that other rule and and do its own thing.

Place the following at the bottom of your theme's advanced style sheet:

.title-bar.bbcode .title_wrapper img {
 display: inline;
}

That works.

Thanks!

Btw, Chris, is there any way to make them look more aligned? As you can see here they look kind of jumbled: link

[Chris]

You might need to explain what you mean by "jumbled" but if your meaning is you wish to draw a line straight down from top to bottom and it passes through all the images then because your category names are centered you would either need to make all the names the same length (heehee) or position the images by adding additional rules. For example adding the red line to what you already have

.title-bar.bbcode .title_wrapper img {
display: inline;
float:left;
}

would position the images all the way to the left

[PF]

I think it looked so uneven because I had the 'collapsible categories' and they were close together when closed. I disabled that plug-in and it looks better now, but I'll try that code too.

Thanks!