MyBB Community Forums

Full Version: Changing forum icon
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Greetings,

I want to change my forum icon from its current gamepad to something custom. How do I go about this?

I'm using the Revolution Theme.

Link to my forum!

Bonus image of the icon(s) I want changed:

[Image: i19uwiX.png]
If you want images

Templates > Revo > Forumbit Templates > forumbit_depth2_forum + forumbit_depth2_cat

Replace this
<div class=" forum_status forum_{$lightbulb['folder']} ajax_mark_read" title="{$lightbulb['altonoff']}" id="mark_read_{$forum['fid']}"><i class="fa fa-gamepad"></i></div>

With
<span class="forum_status forum_{$lightbulb['folder']} ajax_mark_read" title="{$lightbulb['altonoff']}" id="mark_read_{$forum['fid']}"></span>


Themes > Revo > Global.css

Replace this
.forum_status {
height: 50px;
width: 50px;
font-size: 30px;
text-align: center;
}

.forum_status i {
display: inline-block;
line-height: 50px;
}

.forum_on {
color: #3e3e3e;
}

.forum_off, .forum_offlock, .forum_offlink {
color: #333;
}

.forum_off i {
opacity: .4;
}

.forum_offlock i:before {
content: "\f05e";
}

.forum_offlink i:before {
content: "\f079";
}



With this
.forum_status {
display: inline-block;
}

.forum_on {
	background: url(images/revolution/on.png) no-repeat 0 0;
	width: 45px;
	height: 43px;
}

.forum_off {
	background: url(images/revolution/off.png) no-repeat 0 0;
	width: 45px;
	height: 43px;
}

.forum_offlock {
	background: url(images/revolution/lock.png) no-repeat 0 0;
	width: 45px;
	height: 43px;
}

.forum_offlink {
	background: url(images/revolution/redirect.png) no-repeat 0 0;
	width: 45px;
	height: 43px;
}
(2017-01-20, 05:46 PM)iAndrew Wrote: [ -> ]If you want images

Templates > Revo > Forumbit Templates > forumbit_depth2_forum + forumbit_depth2_cat

Replace this
<div class=" forum_status forum_{$lightbulb['folder']} ajax_mark_read" title="{$lightbulb['altonoff']}" id="mark_read_{$forum['fid']}"><i class="fa fa-gamepad"></i></div>

With
<span class="forum_status forum_{$lightbulb['folder']} ajax_mark_read" title="{$lightbulb['altonoff']}" id="mark_read_{$forum['fid']}"></span>


Themes > Revo > Global.css

Replace this
.forum_status {
height: 50px;
width: 50px;
font-size: 30px;
text-align: center;
}

.forum_status i {
display: inline-block;
line-height: 50px;
}

.forum_on {
color: #3e3e3e;
}

.forum_off, .forum_offlock, .forum_offlink {
color: #333;
}

.forum_off i {
opacity: .4;
}

.forum_offlock i:before {
content: "\f05e";
}

.forum_offlink i:before {
content: "\f079";
}



With this
.forum_status {
display: inline-block;
}

.forum_on {
	background: url(images/revolution/on.png) no-repeat 0 0;
	width: 45px;
	height: 43px;
}

.forum_off {
	background: url(images/revolution/off.png) no-repeat 0 0;
	width: 45px;
	height: 43px;
}

.forum_offlock {
	background: url(images/revolution/lock.png) no-repeat 0 0;
	width: 45px;
	height: 43px;
}

.forum_offlink {
	background: url(images/revolution/redirect.png) no-repeat 0 0;
	width: 45px;
	height: 43px;
}

This has for the most part worked... However, my mock-images won't show. I'm unsure why that is, I've added an off.png and on.png to the folder and edited the code as instructed.
You haven't changed the CSS in Global.css
(2017-01-20, 09:01 PM)iAndrew Wrote: [ -> ]You haven't changed the CSS in Global.css

I have in the revolution theme's global.css. Does that mean it needs edited in the default global.css too?

EDIT: There's a big red warning on attempting that so I rather not try it without confirmation.
No, you don't need to edit the default theme at all.

Try deleting the old FontAwesome icon code instead of crossing it out.
(2017-01-20, 09:27 PM)iAndrew Wrote: [ -> ]No, you don't need to edit the default theme at all.

Try deleting the old FontAwesome icon code instead of crossing it out.

All done and tested, no changes.

Is it that the class name doesn't match in the css file?

I'm suspecting the <td> and the <span> does not agree with each other.
(2017-01-20, 09:44 PM)Zarkaylia Wrote: [ -> ]All done and tested, no changes.
Is it that the class name doesn't match in the css file?
I'm suspecting the <td> and the <span> does not agree with each other.

Which <td> ?

Can you send me a temp admin account and i will sort it for you?
Yes, just a moment. However note: I tested to change the span to div. Just fix that if needed.