Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Changing the Forum Icons
First things first, your going to need some images. For this tutorial, I'm going to use images nicked from my /usr/share/icons directory. These image are in .png format, however Internet Explorer 6 does not offer full support of png images, so I recommend you use gif or jpeg images instead.
You need to rename your images. Your new posts icon needs to be called "on.extension", your no new post icon needs to be called "off.extension" and your locked forum icon needs to be called "offlock.extension". So in my case, I have on.png, off.png and offlock.png.

on.png: [Image: on.png]

off.png: [Image: off.png]

offlock.png: [Image: offlock.png]

The images need to be somewhere on the Internet where your forum can access them. You will need to make sure that the image host does not rename your images when they are uploaded, and that the images are all stored in the same folder. I will be using CreateMyBB's image hosting service, so my images directory is "". When you have found a suitable host for the images, upload them and make note of there url.

Once you have your images hosted on a suitable site, its time to start editing templates. In your templates manager, expand the set of templates you want to change. Then expand the "Forum Bit Templates" set of templates. Click the Edit/Change Original button to the right of the "forumbit_depth2_forum" template.
The chunk of code were interested in is
<img src="$theme[imgdir]/$folder.gif" alt="" />
On an original template, this is on the second line. Change "$theme[imgdir]/" to your images directory with a trailing slash. Also, change ".gif" to whatever the file extension is for your images. In my case, i would change the code to this...
<img src="$folder.png" alt="" />
When your done, click the Add Template/Update Template button. Now the front page of your forum should look something like this.

.png   tut1_img1.png (Size: 54.96 KB / Downloads: 67)

The forum icons have now changed, but the icons in the key at the bottom of the page are still the same. To change them, go back into the list of templates, click the Expand button next to the set called "Index Page Templates". Once there, click the Edit/Change Original button to the right of the "index" template.

Look for the following pieces of code,
<img src="$theme[imgdir]/on.gif" alt="$lang->new_posts" />
<img src="$theme[imgdir]/off.gif" alt="$lang->no_new_posts" />
<img src="$theme[imgdir]/offlock.gif" alt="$lang->forum_locked" />
You should find them just past half way down the template. In all three instances, replace "$theme[imgdir]/" with the url to your images folder with a trailing slash, and change ".gif" to the extension of your images. When your done, click the Add Template/Update Template button.
The key should look something like this...

.png   tut1-img2.png (Size: 63.38 KB / Downloads: 46)
[Image: sig-mint.png]
you have described very nicely and gently this help

can we have this updated please as i cannot find those paths


Forum Jump:

Users browsing this thread: 1 Guest(s)