MyBB Community Forums
Positioning Logo and Top Links [DarkFusion] - Printable Version

+- MyBB Community Forums (https://community.mybb.com)
+-- Forum: Extensions (https://community.mybb.com/forum-201.html)
+--- Forum: Themes (https://community.mybb.com/forum-103.html)
+---- Forum: Theme Support (https://community.mybb.com/forum-10.html)
+---- Thread: Positioning Logo and Top Links [DarkFusion] (/thread-105190.html)

Pages: 1 2

Positioning Logo and Top Links [DarkFusion] - HybridForum - 2011-10-03

I'm having trouble editing the theme to my liking, enclosed are how the theme looks at the moment and a mock up of what I'm aiming for.

BEFORE
[Image: jA7rFccDpkL9x.png]

AFTER
[Image: jb0DNC5zDB5in7.png]
Would that kind of edit be all .css side?

.logo {
        height: 61px;
        width: 371px;	
       	margin-top: 150px;
	margin-left: 17.5px;
        padding: 1px 5px 50px 50px;
The above is the current css for the logo that made the "before" image.

The forum is primarily offline and on localhost so I cannot provide a link.

RE: Positioning Logo and Top Links [DarkFusion] - ranjani - 2011-10-04

change to below code AND hard refresh your forum page 

.logo {
height: 61px;
width: 371px;    
margin: 10px auto;
}

you may also have to move logo html code in header template to above of menu code ...

RE: Positioning Logo and Top Links [DarkFusion] - HybridForum - 2011-10-04

@Above: Thank you it has been aligned horizontally, would you know how to align it vertically so it's in the middle of the total header?

How do I change the html without exporting to .xml ?
Thanks for the response!

RE: Positioning Logo and Top Links [DarkFusion] - ranjani - 2011-10-07

" How do I change the html without exporting to .xml " <-- could you elaborate it ...
actually you can directly modify content in templates without exporting to any other format ..

AND can we have your forum URL ...

RE: Positioning Logo and Top Links [DarkFusion] - HybridForum - 2011-10-08

How it looks now after following your guidance:
[Image: jbceSjjbdnJsPx.png]

By the .xml comment I mean in the xml:
<head>
<title>{$mybb->settings['bbname']}</title>
{$headerinclude}
<script type="text/javascript">
<!--
	lang.no_new_posts = "{$lang->no_new_posts}";
	lang.click_mark_read = "{$lang->click_mark_read}";
// -->
</script>
</head>
In the above you can see all the head, title, script tags included in the .xml that the theme relies on, I'm asking if I can edit this .xml while the theme is already active without having to export the .xml and reupload.

There is no URL to give as I said in the thread post, it's currently on localhost

RE: Positioning Logo and Top Links [DarkFusion] - ranjani - 2011-10-08

^ :oops: somehow I missed the localhost part !

in general, we modify code in the templates for the use within our own forum.

can you post the code you have in the header template ...

RE: Positioning Logo and Top Links [DarkFusion] - HybridForum - 2011-10-08

Done:
<a name="top" id="top"></a>
<div id="panel">{$welcomeblock}</div>
<br><br>

<div class="header_right2">
<div class="menu">
<ul>
<li><a href="{$mybb->settings['bburl']}/portal.php" class="portal"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/icons/home.png" alt="" title="" />{$lang->toplinks_portal}</a></li>
<li><a href="{$mybb->settings['bburl']}/index.php" class="index"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/icons/forums.png" alt="" title="" />Forums</a></li>
<li><a href="{$mybb->settings['bburl']}/search.php" class="search"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/icons/search.png" alt="" title="" />{$lang->toplinks_search}</a></li>
<li><a href="{$mybb->settings['bburl']}/memberlist.php" class="members"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/icons/memberlist.png" alt="" title="" />Members</a></li>

<li><a href="{$mybb->settings['bburl']}/misc.php?action=help" class="help"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/icons/help.png" alt="" title="" />{$lang->toplinks_help}</a></li>
</ul>
</div>
</div>
</div>

<div class="header">
<div class="header_in">
<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>
</div>
</div>

<br>
<br>

<div id="container">
<div id="content">
<navigation>

<hr class="hidden" />
<br class="clear" />
{$bannedwarning}
{$bbclosedwarning}
{$unreadreports}
{$pending_joinrequests}
{$pm_notice}
			<br />

I appreciate you helping me out Ranjani.

Edit: Just realised that if I zoom out of the webpage to 50% the logo is in the center where I want it to be, maybe this is helpful?

RE: Positioning Logo and Top Links [DarkFusion] - ranjani - 2011-10-08

please move below part to the top of the header template and report back ...

<div class="header">
<div class="header_in">
<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>
</div>
</div>


RE: Positioning Logo and Top Links [DarkFusion] - HybridForum - 2011-10-09

Result of doing the above:
[Image: jdpwrVFZGR27m.png]

Toplinks were displaced and logo is behind the (navbit?)




Edit: The top navbit? shows up as <div id="panel"></div>
Removing it shows the logo like so:
[Image: jbrdL13CyJa04r.png]

RE: Positioning Logo and Top Links [DarkFusion] - ranjani - 2011-10-12

try this for logo in global.css AND hard refresh your forum page (use CTRL + F5 a couple of times) 
.logo {
margin: 40px auto 0;
}

AND if you need the menu links to be moved to left then you have to change 
<div class="header_right">
<div class="menu">

to 

<div class="header_left">
<div class="menu">