XF 1.3 Images in front of Nodes

[Blue chummer]

Hi , Lets say I have a Forum Topic:

Shimano Reels

How do I put the "Shimano logo" in front of that forum topic?



thanks

 

[TPerry]

Hi , Lets say I have a Forum Topic:

Shimano Reels

How do I put the "Shimano logo" in front of that forum topic?



thanks

Example of code is here.

 

[Blue chummer]

thanks Tracy.
Do you know where I would place this in the admin control panel ?

Example : I already have a forum titled shimano. Here is the image: http://fish.shimano.com/publish/con...x.image.-shimlogo-Single-image.dash.0.57.jpeg
How and where would I place this code for this shimano image in my admin control panel for this forum thread?

 

[TPerry]

thanks Tracy.
Do you know where I would place this in the admin control panel ?

Example : I already have a forum titled shimano. Here is the image: http://fish.shimano.com/publish/con...x.image.-shimlogo-Single-image.dash.0.57.jpeg
How and where would I place this code for this shimano image in my admin control panel for this forum thread?

It's done via the EXTRA.css template. Also, I would recommend redoing the images as actual png's and then make a directory under your root called images and then in there place one called nodes, resulting in /images/nodes to keep them in. It makes it easier to separate them out from other images. Eventually you will want to place them all into a sprite sheet and use that (that's where the background-position: 0px 0px comes in. You would replace the zero's with the sprite image location for that image you want to use.

 

[Blue chummer]

thanks Tracy, I should of started this thread saying "Newbie" But I figured what the hell

I am very new to xen foro. Less than a week. But am on a quick steep learning curve.

- I know where the extra.css files are- so that s good
-I know how to convert the images to png's- that's easy
-making the directory under root - which root , there are a lot of them.?
-Sprite sheet- never heard of this, I have heard of the Drink. I will research it- I understand the principle. It will make it easier in the future. I am going to have probably over 200 separate images needed in front of the brand names. Was figuring I could do this quick but now -maybe not so quick as I thought.

thanks for the heads up. Looks like this endeavor is going to make me somewhat of a programmer.

 

[TPerry]

-making the directory under root - which root , there are a lot of them.?

This will depend on whether you are on a shared hosting account or VPS/dedicated server... and then to add on top of that what HTTP server you use.
For me my old root for my Linux site was in /var/www/servinglinux but now it's the OpenLiteSpeed structure in another area.
If you are on a shared hosting, it's normally under the /public_html location

-Sprite sheet- never heard of this, I have heard of the Drink. I will research it- I understand the principle. It will make it easier in the future. I am going to have probably over 200 separate images needed in front of the brand names. Was figuring I could do this quick but now -maybe not so quick as I thought.

All a sprite sheet is in a nutshell is one large image with other images placed in it at known positions (like 154px 35px) that you can reference via CSS. There are some online utilities that you can use to upload all your images to and it will compile them into a singular sprite sheet and then provide you with the positions of the images in it. http://spritegen.website-performance.org/ is one I use often - you just need to adjust the offsets so they are a little closer together. You archive all your images into a ZIP archive and upload it and then it does the rest and then gives you another file to download.
The benefit of spritesheets is for speed basically. Instead of making 200 http requests it only makes one for the main sprite sheet. You will find that pagespeed recommends it when you have lots of icons like that.

 

[Blue chummer]

thank you Tracy that helps. I don't have the hosting yet. I am developing the site on my computer using Xaamp .

Great info on the Sprite sheets. I think that is way I will be heading with this. Don't want to have to do 200 plus separate http requests. thanks