MyBB Community Forums

Full Version: How to display different logos on selected forums?
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2 3
Thank you I've added those body tags to Forumdisplay and Index templates.

My Header template looks like this:
<div id="container">
		<a name="top" id="top"></a>
		<div id="header">
			<div class="logo" style="margin:0 auto;text-align:center"><a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a></div>
			<div class="menu">
				<ul>
					<li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$theme['imgdir']}/toplinks/search.gif" alt="" title="" />{$lang->toplinks_search}</a></li>
					<li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$theme['imgdir']}/toplinks/memberlist.gif" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
					<li><a href="{$mybb->settings['bburl']}/calendar.php"><img src="{$theme['imgdir']}/toplinks/calendar.gif" alt="" title="" />{$lang->toplinks_calendar}</a></li>
					<li><a href="{$mybb->settings['bburl']}/misc.php?action=help"><img src="{$theme['imgdir']}/toplinks/help.gif" alt="" title="" />{$lang->toplinks_help}</a></li>
				</ul>
			</div>
			<hr class="hidden" />
			<div id="panel">
				{$welcomeblock}
			</div>
		</div>
		<hr class="hidden" />
		<br class="clear" />
		<div id="content">
			{$pm_notice}
			{$bannedwarning}
			{$bbclosedwarning}
			{$unreadreports}
			{$pending_joinrequests}
			<navigation>
			<br />
new header template:


<div id="container">
        <a name="top" id="top"></a>
        <div id="header">
            <a href="{$mybb->settings['bburl']}/index.php"><div class="biglogo">MY SITE</div></a>
            <div class="menu">
                <ul>
                    <li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$theme['imgdir']}/toplinks/search.gif" alt="" title="" />{$lang->toplinks_search}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$theme['imgdir']}/toplinks/memberlist.gif" alt="" title="" />{$lang->toplinks_memberlist}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/calendar.php"><img src="{$theme['imgdir']}/toplinks/calendar.gif" alt="" title="" />{$lang->toplinks_calendar}</a></li>
                    <li><a href="{$mybb->settings['bburl']}/misc.php?action=help"><img src="{$theme['imgdir']}/toplinks/help.gif" alt="" title="" />{$lang->toplinks_help}</a></li>
                </ul>
            </div>
            <hr class="hidden" />
            <div id="panel">
                {$welcomeblock}
            </div>
        </div>
        <hr class="hidden" />
        <br class="clear" />
        <div id="content">
            {$pm_notice}
            {$bannedwarning}
            {$bbclosedwarning}
            {$unreadreports}
            {$pending_joinrequests}
            <navigation>
            <br />

In your global css

body.index .biglogo {
background:url(images/logo.png)no-repeat;
text-indent:-9999px;
width:320px;
height:80px;
margin:auto;
max-width:100%;
display:block;
}

body.forum_4 .biglogo {
background:url(images/logo4.png)no-repeat;
text-indent:-9999px;
width:320px;
height:80px;
margin:auto;
max-width:100%;
display:block;
}


and so on. You need to set the height and width to match the image size and width.

EDIT: I made an error in the css - my apologies.
Thank you!!

In header template, do I replace MY SITE with an image url? Can I center the image?

Also in global css, this line:
background:url(images/logo.png)no-repeat;

Do I replace exactly "url(images/logo.png)" to an URL, with a space between 'no-repeat;'?

Thank you again!
----

Oh never mind I think I know how to edit global css now. Thanks!
remember, several forums can share one image; you may need to add a rule - some thing like

.biglogo {
background:url(images/mygeneralimage.png)no-repeat;
text-indent:-9999px;
width:320px;
height:80px;
margin:auto;
max-width:100%;
display:block;
}
Oh my god successful (crying)
Thank you you are my life saver!
Check forum 4 for a picture of my cat lol.

Thank you, Leefish!!

EDIT 1:
Just one last thing,

I want to add the text that would display when mousing over the logo image to my forum's name. I think it used to display that but not anymore. I'm not sure where to add it?

Thanks!

EDIT 2:
Wait hold on, now I'm viewing a thread inside a forum, and it does not display the forum's top image, instead it displays the global logo. I would expect the top image to match the forum's until I go back to index or to another forum without a specified image.
exactly - that is why you need the css I posted - the additional logo.

You need to put that in the global css and then after it the special ones with the body.index etc. so the first biglogo is the default logo - if you change to a forum with a special image it will overwrite it, otherwise you see the "normal" logo. You see?

also, showthread - also has a body tag, but it is a MUCH harder thing to do in CSS; how do you know which thread it is?
Yes I already put the additional logo in there.

It seems odd and confusing not to have the same image for all threads inside a forum...
well, you can see it in the url - when you look at a thread you are not in a forum; you are in a thread.

It would have been the same with the php code. The only OTHER option is to use a new theme per forum.
I see... the idea of applying a new theme per forum seemed very redundant to me but it looks like it's the only option.

Thank you for your help!
well, you can be smart with it. Make the NEW forum theme the child of the main theme, use the main theme templates and use the same idea on the header as I gave you. Except this time, all you change is the global css and make the url to the big logo the one for that forum. All the rest of the css will be inherited from the main theme.

Its what I do for this forum on my own site: http://www.leefish.nl/mybb/forumdisplay.php?fid=34 (plus some color changes)

PS - I think that if you later decide to use MYBB mobile this approach will be an issue. This wish to have a mobile theme and be able to use MyBB's child themes etc is why I made my site responsive.
Pages: 1 2 3