MyBB Community Forums

Am trying to change my forums legends to:
[attachment=33206]  [attachment=33207]  [attachment=33208]  [attachment=33209]

Managed to get them to change at the bottom of the index page by replacing:

<dl class="forum_legend smalltext">
    <dt><span class="forum_status forum_on" title="{$lang->new_posts}"></span></dt>
    <dd>{$lang->new_posts}</dd>
    <dt><span class="forum_status forum_off" title="{$lang->no_new_posts}"></span></dt>
    <dd>{$lang->no_new_posts}</dd>
    <dt><span class="forum_status forum_offlock" title="{$lang->forum_locked}"></span></dt>
    <dd>{$lang->forum_locked}</dd>
    <dt><span class="forum_status forum_offlink" title="{$lang->forum_redirect}"></span></dt>
    <dd>{$lang->forum_redirect}</dd>
</dl>

with:

<dl class="forum_legend smalltext">
    <dt><img src="{$theme['imgdir']}/NewPosts.png" alt="{$lang->new_posts}" title="{$lang->new_posts}" style="vertical-align: middle; padding-bottom: 4px;" /></dt>
    <dd>{$lang->new_posts}</dd>
    <dt><img src="{$theme['imgdir']}/NoNewPosts.png" alt="{$lang->no_new_posts}" title="{$lang->no_new_posts}" style="vertical-align: middle; padding-bottom: 4px;" /></dt>
    <dd>{$lang->no_new_posts}</dd>
    <dt><img src="{$theme['imgdir']}/Locked.png" alt="{$lang->forum_locked}" title="{$lang->forum_locked}" style="vertical-align: middle;" /></dt>
    <dd>{$lang->forum_locked}</dd>
    <dt><img src="{$theme['imgdir']}/RedirectForum.png" alt="{$lang->forum_redirect}" title="{$lang->forum_redirect}" style="vertical-align: middle;" /></dt>
    <dd>{$lang->forum_redirect}</dd>
</dl>

However I can't seem to work out how to change the legends which get displayed on the actual forums.

Can anyone give me any pointers?
Thanks

You'll need to go into your selected theme css. Select forumdisplay.css and you will see everything you need to change this.

in global.css find this part and edit the css accordingly.... first remove the background image sprite from .forum_status and then add individual images to .forum_on, .forum_off, .forum_offlock, .forum_offlink

.forum_status {

 height: 30px;
width: 30px;
background: url(images/forum_icon_sprite.png) no-repeat 0 0;
display: inline-block;
}

.forum_on {
background-position: 0 0;
}

.forum_off {
background-position: 0 -30px;
}

.forum_offlock {
background-position: 0 -60px;
}

.forum_offlink {
background-position: 0 -90px;
}

Thanks for your help both.

Just in case anyone else looking to do a similar thing, this is how the part in my global.css now looks.

.forum_status {
	height: 30px;
	width: 30px;
	display: inline-block;
}

.forum_on {
	background-position: 0 0;
    background: url(images/NewPosts.png) no-repeat 0 0;
}

.forum_off {
	background-position: 0 -30px;
    background: url(images/NoNewPosts.png) no-repeat 0 0;
}

.forum_offlock {
	background-position: 0 -60px;
    background: url(images/Locked.png) no-repeat 0 0;
}

.forum_offlink {
	background-position: 0 -90px;
    background: url(images/RedirectForum.png) no-repeat 0 0;
}

Your way works but isn't very effective. Try this:

Copy the attached picture to the image folder on server. Then replace your posted css part with:

.forum_status {
	height: 36px;
	width: 36px;
	background: url(images/my_forum_icon_sprite.png) no-repeat 0 0;
	display: inline-block;
}

.forum_on {
	background-position: 0 0;
}

.forum_off {
	background-position: 0 -36px;
}

.forum_offlock {
	background-position: 0 -72px;
}

.forum_offlink {
	background-position: 0 -108px;
}

Many thanks for that Sven

My pleasure...