How to add images to the navigation bar 1.0

[Lawrence]

Guys I'm going crazy here, can you tell me how much snow images you see at the header at www.teeveetown.com/forum ?

My IE sees one (correct), my Chrome sees three (correct), but my Firefox shows one (should be showing three). I've cleared cache and all, but I still see one.

3 in FF, 3 in IE 9 Beta, and 1 in IE Compatibility mode.

 

[Peter]

The original one was 30px and the new ones are 25px.
I've attached it to this post but you will need to update the css accordingly.

Thanks Brogan. I can upload all three to the path shown in the first post but wouldn't it be better to be in a folder? Right now, there's only one other file (index.html) in styles/default/ and one folder name xenforo. I'm still trying to understand how things work.

 

[Paul B]

You can put the images wherever you like, it just depends how you want to organise things.

If the images are unique to an individual style then you can put them in that style's folder.
If multiple styles are using the same images then it makes sense to have a common folder.

Either way though, it's just a path to a file so it makes little difference when in use although it can sometimes depend on whether you use relative or absolute paths.

The path in the css in the first post is to the root folder of the default style, that's correct.

 

[steven s]

I wonder what would cause the left and center to be slightly higher?


SOLVED: I downloaded the thumbs, not the actual image.

 

[Paul B]

You're using 3 different sized images it looks like.
The left is 10px, the centre 17px and the right is 30px.

 

[steven s]

You're using 2 different sized images it looks like.
The left and centre are 25px and the right is 30px.

I originally downloaded the 3 images from the first post. Then I downloaded the 30px image having the same result.
I replaced the right image with the image from the first post.
heights 10px 17px 25px
Is it an alignment problem?

 

[Paul B]

I just download the 3 images from the first post and added the css listed there to EXTRA.css and it worked fine.

#navigation .helper {
background: url(styles/default/shelley_snow_l.png) no-repeat 0% 0%, url(styles/default/shelley_snow_c.png) no-repeat 50% 0%, url(styles/default/shelley_snow_r.png) no-repeat 100% 0%;
display: block;
height: 25px;
left: -5px;
padding: 0px 5px;
position: absolute;
top: -16px;
width: 100%;
}

For some reason your images are not the same size as the ones in the first post.
Try downloading and uploading them again.

 

[steven s]

I right-clicked the images off of the XF header. Uploaded them and it is OK.
The images I downloaded from the first post where not as high.
I don't know why. ??

 

[Paul B]

Are you right clicking and saving the attachments in the first post?
Those are the attachment thumbs not the actual images.

You need to click on the attachment image or file name and it will load the image in a new tab which you can then save.

 

[steven s]

Are you right clicking and saving the attachments in the first post?
Those are the attachment thumbs not the actual images.

You need to click on the attachment image or file name and it will load the image in a new tab which you can then save.

Then that is what I was doing wrong. I right clicked on the thumbs.
When I rollover the image or the filename, the filename is the same so I figured I was downloading the same file.

 

[Paul B]

You can right click and download using the file name but not the image.

 

[Floris]

I wonder what would cause the left and center to be slightly higher?
View attachment 6966

SOLVED: I downloaded the thumbs, not the actual image.

hahaha
honest mistake

 

[steven s]

hahaha
honest mistake

Live and learn. I figure there must be at least one person who has made the same mistake.
Maybe not.

 

[Ranger375]

I'm slow. Ok...I uploaded the files to my styles/default folder. Then I added:

#navigation .helper {
background: transparent url(styles/default/shelley_snow_l.png) no-repeat;
display: block;
height: 25px;
left: -5px;
position: absolute;
top: -16px;
width: 250px;
}

to my Extra.css

Im rockin Beta 4...so that should be it right?

 

[Paul B]

Yes, that's all that's required for the left image.

What are you seeing?
Can you post a link to your site?

 

[Ranger375]

Never mind.... I am on beta 4...but I had to modify the navigation template as instructed.... It didnt tell me the template was out of date either

 

[Floris]

Quite disappointed that there's no new fun image in the header today after waking up ;(

hehe

 

[Paul B]

Never mind.... I am on beta 4...but I had to modify the navigation template as instructed.... It didnt tell me the template was out of date either

That's a known bug: http://xenforo.com/community/threads/xenforo-1-0-0-beta-4-released.8732/#post-120570

Try reverting the template and it should be fine after that.

 

[Ranger375]

That's a known bug: http://xenforo.com/community/threads/xenforo-1-0-0-beta-4-released.8732/#post-120570

Try reverting the template and it should be fine after that.

Ahh, thank you sir

 

[Martyn]

how do you add this to the new beta 4?? is there an easier way i thought beta 4 would have ways of adding stuff likle this?