MyBB Community Forums

Full Version: Trying to integrate Mybb into my sites template
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2
I am trying to keep my sites template intact, but I am having a lot of trouble integrating mybb with my sites header on top.

www.finalforce.info

That is the site, when you click forums you can see my problem lol.
What is your header code?
This is the header code I am trying to integrate:

<div class="template"><body onload="MM_preloadImages('images/en_08r.gif','images/en_09r.gif','images/en_10r.gif','images/en_11r.gif','images/en_12r.gif','images/en_13r.gif','images/en_14r.gif','images/en_15r.gif')">
<!-- Copyright Clantemplates.com - Created by Psycrotic == *DO NOT REMOVE THIS* == -->
<!-- Copyright Clantemplates.com - Created by Psycrotic == *DO NOT REMOVE THIS* == -->
<center>
<table width="813" border="0" height="100%" cellpadding="0" cellspacing="0">
  <!--DWLayoutTable-->
  <tr>
    <td height="203" colspan="11" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
      <!--DWLayoutTable-->
      <tr>
        <td width="58" height="184" valign="top"><img src="images/en_02.gif" width="58" height="184" /></td>
    <td colspan="3" valign="top"><img src="images/en_03.gif" width="697" height="184" /></td>
    <td width="58" valign="top"><img src="images/en_04.gif" width="58" height="184" /></td>
    </tr>
      <tr>
        <td height="19" valign="top"><img src="images/en_06.gif" width="58" height="19" /></td>
    <td width="249" valign="top"><img src="images/en_07.gif" width="249" height="19" /></td>
    <td width="376" valign="top"><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image33','','images/en_08r.gif',1)"><img src="images/en_08.gif" name="Image33" width="34" height="19" border="0" id="Image33" /></a><a href="roster.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image34','','images/en_09r.gif',1)"><img src="images/en_09.gif" name="Image34" width="44" height="19" border="0" id="Image34" /></a><a href="/forums" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image35','','images/en_10r.gif',1)"><img src="images/en_10.gif" name="Image35" width="46" height="19" border="0" id="Image35" /></a><a href="downloads.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image36','','images/en_11r.gif',1)"><img src="images/en_11.gif" name="Image36" width="66" height="19" border="0" id="Image36" /></a><a href="links.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image37','','images/en_12r.gif',1)"><img src="images/en_12.gif" name="Image37" width="35" height="19" border="0" id="Image37" /></a><a href="contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image38','','images/en_13r.gif',1)"><img src="images/en_13.gif" name="Image38" width="51" height="19" border="0" id="Image38" /></a><a href="join.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image39','','images/en_14r.gif',1)"><img src="images/en_14.gif" name="Image39" width="43" height="19" border="0" id="Image39" /></a><a href="about.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image40','','images/en_15r.gif',1)"><img src="images/en_15.gif" name="Image40" width="57" height="19" border="0" id="Image40" /></a></td>
    <td width="72" valign="top"><img src="images/en_16.gif" width="72" height="19" /></td>
    <td valign="top"><img src="images/en_17.gif" width="58" height="19" /></td>
  </tr>

    </table>    </td>
    </tr>
  
  <tr>
    <td width="58" rowspan="5" valign="top" background="images/en_18.gif"><img src="images/en_18.gif" width="58" height="633" /></td>
    
&nbsp;<td width="58" rowspan="5" valign="top" background="images/en_22.gif"><img src="images/en_22.gif" width="58" height="633" /></td>
  </tr>
Looks like you've removed all the MyBB code from the header. You need to put your header code within the code that's already there, so your header template looks something like this:

	<div id="container">
		<a name="top" id="top"></a>
		<div id="header">
<div class="template"><body onload="MM_preloadImages('images/en_08r.gif','images/en_09r.gif','images/en_10r.gif','images/en_11r.gif','images/en_12r.gif','images/en_13r.gif','images/en_14r.gif','images/en_15r.gif')">
<!-- Copyright Clantemplates.com - Created by Psycrotic == *DO NOT REMOVE THIS* == -->
<!-- Copyright Clantemplates.com - Created by Psycrotic == *DO NOT REMOVE THIS* == -->
<center>
<table width="813" border="0" height="100%" cellpadding="0" cellspacing="0">
  <!--DWLayoutTable-->
  <tr>
    <td height="203" colspan="11" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
      <!--DWLayoutTable-->
      <tr>
        <td width="58" height="184" valign="top"><img src="images/en_02.gif" width="58" height="184" /></td>
    <td colspan="3" valign="top"><img src="images/en_03.gif" width="697" height="184" /></td>
    <td width="58" valign="top"><img src="images/en_04.gif" width="58" height="184" /></td>
    </tr>
      <tr>
        <td height="19" valign="top"><img src="images/en_06.gif" width="58" height="19" /></td>
    <td width="249" valign="top"><img src="images/en_07.gif" width="249" height="19" /></td>
    <td width="376" valign="top"><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image33','','images/en_08r.gif',1)"><img src="images/en_08.gif" name="Image33" width="34" height="19" border="0" id="Image33" /></a><a href="roster.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image34','','images/en_09r.gif',1)"><img src="images/en_09.gif" name="Image34" width="44" height="19" border="0" id="Image34" /></a><a href="/forums" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image35','','images/en_10r.gif',1)"><img src="images/en_10.gif" name="Image35" width="46" height="19" border="0" id="Image35" /></a><a href="downloads.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image36','','images/en_11r.gif',1)"><img src="images/en_11.gif" name="Image36" width="66" height="19" border="0" id="Image36" /></a><a href="links.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image37','','images/en_12r.gif',1)"><img src="images/en_12.gif" name="Image37" width="35" height="19" border="0" id="Image37" /></a><a href="contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image38','','images/en_13r.gif',1)"><img src="images/en_13.gif" name="Image38" width="51" height="19" border="0" id="Image38" /></a><a href="join.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image39','','images/en_14r.gif',1)"><img src="images/en_14.gif" name="Image39" width="43" height="19" border="0" id="Image39" /></a><a href="about.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image40','','images/en_15r.gif',1)"><img src="images/en_15.gif" name="Image40" width="57" height="19" border="0" id="Image40" /></a></td>
    <td width="72" valign="top"><img src="images/en_16.gif" width="72" height="19" /></td>
    <td valign="top"><img src="images/en_17.gif" width="58" height="19" /></td>
  </tr>

    </table>    </td>
    </tr>
  
  <tr>
    <td width="58" rowspan="5" valign="top" background="images/en_18.gif"><img src="images/en_18.gif" width="58" height="633" /></td>
    
&nbsp;<td width="58" rowspan="5" valign="top" background="images/en_22.gif"><img src="images/en_22.gif" width="58" height="633" /></td>
  </tr>
			<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 />
I may sound like a newbie, but how come when I copy your code and paste it in the header I get &nbsp; a million times?
Well, if you just edit the code a bit, it does that if you don't edit it, like where it says copyright clantemplates, just like add another space or something there, and then save, it should work.. Also I sent you a PM, don't know if you saw it..
It's just the default header template with your code in the middle, so if it's easier just revert the template and then insert your code. Smile
Hey can anyone help me fix this bug I got when I integrated:

www.finalforce.info/forums , just a random set of bars when you scroll down.

Here is my code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>OUTBREAK - Default "'Created by Psycrotic'"</title>
<link href="out.css" type="text/css" rel="stylesheet">
<script type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>

<body onload="MM_preloadImages('images/en_08r.gif','images/en_09r.gif','images/en_10r.gif','images/en_11r.gif','images/en_12r.gif','images/en_13r.gif','images/en_14r.gif','images/en_15r.gif')">
<!-- Copyright Clantemplates.com - Created by Psycrotic == *DO NOT REMOVE THIS* == -->
<!-- Copyright Clantemplates.com - Created by Psycrotic == *DO NOT REMOVE THIS* == -->
<center>
<table width="813" border="0" height="100%" cellpadding="0" cellspacing="0">
  <!--DWLayoutTable-->
  <tr>
    <td height="203" colspan="11" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
      <!--DWLayoutTable-->
      <tr>
        <td width="58" height="184" valign="top"><img src="images/en_02.gif" width="58" height="184" /></td>
    <td colspan="3" valign="top"><img src="images/en_03.gif" width="697" height="184" /></td>
    <td width="58" valign="top"><img src="images/en_04.gif" width="58" height="184" /></td>
    </tr>
      <tr>
        <td height="19" valign="top"><img src="images/en_06.gif" width="58" height="19" /></td>
    <td width="249" valign="top"><img src="images/en_07.gif" width="249" height="19" /></td>
    <td width="376" valign="top"><a href="http://www.finalforce.info/index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image33','','images/en_08r.gif',1)"><img src="images/en_08.gif" name="Image33" width="34" height="19" border="0" id="Image33" /></a><a href="http://www.finalforce.info/roster.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image34','','images/en_09r.gif',1)"><img src="images/en_09.gif" name="Image34" width="44" height="19" border="0" id="Image34" /></a><a href="http://www.finalforce.info/forums" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image35','','images/en_10r.gif',1)"><img src="images/en_10.gif" name="Image35" width="46" height="19" border="0" id="Image35" /></a><a href="http://www.finalforce.info/downloads.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image36','','images/en_11r.gif',1)"><img src="images/en_11.gif" name="Image36" width="66" height="19" border="0" id="Image36" /></a><a href="http://www.finalforce.info/links.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image37','','images/en_12r.gif',1)"><img src="images/en_12.gif" name="Image37" width="35" height="19" border="0" id="Image37" /></a><a href="http://www.finalforce.info/contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image38','','images/en_13r.gif',1)"><img src="images/en_13.gif" name="Image38" width="51" height="19" border="0" id="Image38" /></a><a href="http://www.finalforce.info/join.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image39','','images/en_14r.gif',1)"><img src="images/en_14.gif" name="Image39" width="43" height="19" border="0" id="Image39" /></a><a href="http://www.finalforce.info/about.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image40','','images/en_15r.gif',1)"><img src="images/en_15.gif" name="Image40" width="57" height="19" border="0" id="Image40" /></a></td>
    <td width="72" valign="top"><img src="images/en_16.gif" width="72" height="19" /></td>
    <td valign="top"><img src="images/en_17.gif" width="58" height="19" /></td>
  </tr>
    </table>    </td>
    </tr>
  
<tr>
    <td width="58" rowspan="5" valign="top" background="images/en_18.gif"><img src="images/en_18.gif" width="58" height="633" /></td>
    <td height="41" colspan="3" valign="top"><img src="images/en_19.gif" width="233" height="41" /></td>
    <td colspan="3" valign="top"><img src="images/en_20.gif" width="229" height="41" /></td>
    <td colspan="3" valign="top"><img src="images/en_21.gif" width="235" height="41" /></td>
    <td width="58" rowspan="5" valign="top" background="images/en_22.gif"><img src="images/en_22.gif" width="58" height="633" /></td>
  </tr>
  <tr>
    <td width="16" height="156" valign="top" background="images/en_23.gif"><img src="images/en_23.gif" width="16" height="156" alt="" /></td>
    <td width="206" valign="top" background="images/cbg.gif" bgcolor="#181818"><div align="center"><span class="mini"></span><span class="mini"></span><br />
      Clan War Info Coming Soon...<br />
      <span class="mini">Final_Force_</span> vs. <span class="mini">N/A</span><br />
      No Info Available<br />
      <span class="mini">Final_Force_</span> vs. <span class="mini">N/A</span><br />
      No Info Available<br />
      <span class="mini">Final_Force_</span>] vs. <span class="mini">N/A</span><br />
      No Info Available<br />
      <span class="mini">Final_Force_</span> vs. <span class="mini">N/A</span><br />
      No Info Available<br />
      <span class="mini">Final_Force_</span> vs. <span class="mini">N/A</span><br />
      No Info Available<br />
    </div></td>
    <td width="11" valign="top" background="images/en_25.gif"><img src="images/en_25.gif" width="11" height="156" alt="" /></td>
    <td width="12" valign="top" background="images/en_26.gif"><img src="images/en_26.gif" width="12" height="156" alt="" /></td>
    <td width="205" valign="top" background="images/cbg.gif" bgcolor="#181818"><p><font size="2">Hello all! For all of our new recruits you must download Raidcall. Raidcall is a program that you can use with a headset to chat with us while in game. Please visit <a href="http://www.raidcall.com">www.raidcall.com</a> to sign up and download it. Then search for [Final-Force] to join our Raidcall.</font></p>      </td>
    <td width="12" valign="top" background="images/en_28.gif"><img src="images/en_28.gif" width="12" height="156" alt="" /></td>
    <td width="12" valign="top" background="images/en_29.gif"><img src="images/en_29.gif" width="12" height="156" alt="" /></td>
    <td width="206" align="center" valign="top" background="images/cbg.gif" bgcolor="#181818"><br><font size="2">None At The Moment</font></td>
    <td width="17" valign="top" background="images/en_31.gif"><img src="images/en_31.gif" width="17" height="156" alt="" /></td>
  </tr>
  <tr>
    <td height="359" colspan="9" valign="top">    <table width="100%" border="0" cellpadding="0" cellspacing="0">
      <!--DWLayoutTable-->
      <tr>
        <td height="14" colspan="3" valign="top"><img src="images/en_35.gif" width="697" height="14" alt=""/></td>
      </tr>  
      
          <div id="container">
        <a name="top" id="top"></a>
        <div id="header">
            <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>
<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>
<body>
{$header}
{$forums}
{$boardstats}

<dl class="forum_legend smalltext">
    <dt><img src="{$theme['imgdir']}/on.gif" alt="{$lang->new_posts}" title="{$lang->new_posts}" style="vertical-align: middle; padding-bottom: 4px;" /></dt>
    <dd>{$lang->new_posts}</dd>

    <dt><img src="{$theme['imgdir']}/off.gif" alt="{$lang->no_new_posts}" title="{$lang->no_new_posts}" style="vertical-align: middle; padding-bottom: 4px;" /></dt>
    <dd>{$lang->no_new_posts}</dd>

    <dt><img src="{$theme['imgdir']}/offlock.gif" alt="{$lang->forum_locked}" title="{$lang->forum_locked}" style="vertical-align: middle;" /></dt>
    <dd>{$lang->forum_locked}</dd>
</dl>
<br style="clear: both" />
{$footer}
            <br />
  <br />
</p>
          </td>
        <td width="17" valign="top" background="images/en_40.gif"><img src="images/en_38.gif" width="17" height="24" alt="" /><br />
            <img src="images/en_40.gif" width="17" height="276" alt="" /><br/>
        </td>
      </tr>
      <tr>
        <td height="45" colspan="3" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">
          <!--DWLayoutTable-->
          <tr>
            <td width="16" height="24" valign="top"><img src="images/en_41.gif" width="16" height="24" alt="" /></td>
        <td width="664" valign="top" style="background-image: url('images/cbg.gif');"><!--DWLayoutEmptyCell-->&nbsp;</td>
          <td width="17" valign="top"><img src="images/en_42.gif" width="17" height="24" alt="" /></td>
      </tr>
          <tr>
            <td height="21" colspan="3" valign="top"><img src="images/en_43.gif" width="697" height="21" alt="" /></td>
Looks good to me, I don't see any random bars?
The botton of the skin(But part of mybb) seems to be offlined for some weird reason.
Pages: 1 2