How can I put a graphic at the top of my forum the same way that “The Grand Tetons by Stuck in Customs” appears at the top of this forum? I’m using MyBB 1.6.3 I have not installed any themes or plugins. Thank you for your help.
assuming that you have default theme :
simple method is to replace ../images/logo.gif with your own image !!
OR in header template ,
add the image code above or below of <div id="container"> to experiment with it !!
Navigate to your theme global.css
Find .logo {
Add this code within
background: url(images/your image here);
This is ths code for image background.
Add your image path within the code
If it is not there add this code at bottom
Add this code :
.logo {
background: url(images/your image here);
width: 100%;
margin: auto auto;
padding: 20px;
text-align: left;
height: 100px;
}
Now in header templates of your theme u
Need to edit a few templates,if u r using a theme that has logo within container.
Add this if you have Logo within container
<div class="logo"><a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a></div>
<div class="menu" align="center">
<ul>
<li><a href="{$mybb->settings['bburl']}">Home</a></li>
<li><a href="{$mybb->settings['bburl']}/index.php" id="forums">Forums</a></li>
<li><a href="{$mybb->settings['bburl']}/search.php">Search</a></li>
<li><a href="{$mybb->settings['bburl']}/memberlist.php">{$lang->toplinks_memberlist}</a></li>
<li><a href="{$mybb->settings['bburl']}/calendar.php">{$lang->toplinks_calendar}</a></li>
<li><a href="{$mybb->settings['bburl']}/misc.php?action=help">{$lang->toplinks_help}</a></li>
</ul>
</div>
<div id="panel" align="center">{$welcomeblock}</div><br /><br />
<div id="container">
<div id="header">
<hr class="hidden" />
</div>
<hr class="hidden" />
<br class="clear" />
<div id="content">
{$pm_notice}
{$bannedwarning}
{$bbclosedwarning}
{$unreadreports}
{$pending_joinrequests}
<navigation>
<br />
Hope this helps fully.
(2011-07-06, 04:42 AM)envira Wrote: [ -> ]Navigate to your theme global.css
Find .logo {
Add this code within
background: url(images/your image here);
This is ths code for image background.
Add your image path within the code
If it is not there add this code at bottom
Add this code :
.logo {
background: url(images/your image here);
width: 100%;
margin: auto auto;
padding: 20px;
text-align: left;
height: 100px;
}
Now in header templates of your theme u
Need to edit a few templates,if u r using a theme that has logo within container.
Add this if you have Logo within container
<div class="logo"><a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a></div>
<div class="menu" align="center">
<ul>
<li><a href="{$mybb->settings['bburl']}">Home</a></li>
<li><a href="{$mybb->settings['bburl']}/index.php" id="forums">Forums</a></li>
<li><a href="{$mybb->settings['bburl']}/search.php">Search</a></li>
<li><a href="{$mybb->settings['bburl']}/memberlist.php">{$lang->toplinks_memberlist}</a></li>
<li><a href="{$mybb->settings['bburl']}/calendar.php">{$lang->toplinks_calendar}</a></li>
<li><a href="{$mybb->settings['bburl']}/misc.php?action=help">{$lang->toplinks_help}</a></li>
</ul>
</div>
<div id="panel" align="center">{$welcomeblock}</div><br /><br />
<div id="container">
<div id="header">
<hr class="hidden" />
</div>
<hr class="hidden" />
<br class="clear" />
<div id="content">
{$pm_notice}
{$bannedwarning}
{$bbclosedwarning}
{$unreadreports}
{$pending_joinrequests}
<navigation>
<br />
Hope this helps fully.
I forgot to mention in my OP that I have not installed any themes or plugins.
I can’t find .logo I went to: Templates & Style > Themes > Default > global.css
I saw a drop down for Selector which starts with #container and I looked through the list but didn’t find .logo
editing stylesheet has two modes in the admin panel. 1. simple mode 2. Advanced mode
in advanced mode, at the bottom, add .logo AND do required modifications as
envira suggested
.logo {
background: url(images/your image here);
width: 100%;
margin: auto auto;
padding: 20px;
text-align: left;
height: 100px;
}
(2011-07-06, 06:39 PM)ranjani Wrote: [ -> ]editing stylesheet has two modes in the admin panel. 1. simple mode 2. Advanced mode
in advanced mode, at the bottom, add .logo AND do required modifications as envira suggested
.logo {
background: url(images/your image here);
width: 100%;
margin: auto auto;
padding: 20px;
text-align: left;
height: 100px;
}
I think I found where to place the above code, thank you.
I'm having trouble understanding what I should modify in the header template so I'll quote envira's post (to avoid that infernal auto post merge) and ask him about it but if you know what I'm talking about please reply.
@Mods,
This automatically merging posts is a
serious PITA!!!
(2011-07-06, 04:42 AM)envira Wrote: [ -> ]Now in header templates of your theme u
Need to edit a few templates,if u r using a theme that has logo within container.
Add this if you have Logo within container
<snip>
Here is my unmodified header template (shown as PHP to prevent wrapping):
<div id="container">
<a name="top" id="top"></a>
<div id="header">
<div class="logo"><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 />
Can you modify the above (and post in PHP like I did) because I don't have a clue what you want me to do to that template. Please accept my apology if I'm asking too much. Thank you for your reply.
Just replace your header template with the code i gave
Edit : deleted some code content as I've mistaken ...
__________________________________________
you can experiment with the header template and revert to original whenever necessary
![[Image: revert.png]](https://camo.mybb.com/67eb25bc98a753c2c302c676971d38c485cff828/687474703a2f2f696d673731332e696d616765736861636b2e75732f696d673731332f363737332f7265766572742e706e67)
(2011-07-08, 05:01 AM)ranjani Wrote: [ -> ]Edit : deleted some code content as I've mistaken ...
__________________________________________
you can experiment with the header template and revert to original whenever necessary
Thanks for the screenshot. I was aware of "Revert to Original", it's extremely handy.
Envira recommended I use his code as is so I don't understand why it doesn't work as advertised. I hope he offers a fix.