MyBB Community Forums
Moving The Panel - Printable Version

+- MyBB Community Forums (
+-- Forum: Extensions (
+--- Forum: Themes (
+---- Forum: Theme Support (
+---- Thread: Moving The Panel (/thread-95181.html)

Moving The Panel - MrJohn - 2011-05-26

I ran in to yet another problem with my theme creation. I need to move the panel to the area that I have made for it in the logo. How would I go about doing that? I would also want to make it transparent if I could.


RE: Moving The Panel - Alan S. - 2011-05-26

Float it within the header, add float:right; to #panel

Without seeing the code you're using it's hard to give any more guidance than that.

RE: Moving The Panel - MrJohn - 2011-05-26

Here is my header:

<div id="container">
<div class="menu">
					<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>

		<a name="top" id="top"></a>
		<div id="header">

	<div id="panel">
			<div class="logo"><a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a></div>
			<hr class="hidden" />

		<hr class="hidden" />
		<br class="clear" />
		<div id="content">
			<br />

Here is my #Panel:

#panel {
	background: #000;
              width: 350px;
              float: right;
	color: #fff;
	font-size: 11px;
	border: 1px solid #D4D4D4;
	padding: 8px;

RE: Moving The Panel - Alan S. - 2011-05-26

Try putting the panel inside the logo div:

            <div class="logo">
<div id="panel">{$welcomeblock}</div>

Then add some margins to align it correctly.

RE: Moving The Panel - MrJohn - 2011-05-26

Did not change any thing. Thanks for the suggestion though.

RE: Moving The Panel - Alan S. - 2011-05-26

Is that whole image set as the logo? It needs to be set as a background image in the CSS for what I suggested to work. Without seeing all the code together it's not easy to see what will work.

RE: Moving The Panel - MrJohn - 2011-05-27

Ah that was it, worked like a charm. Thanks mate!