Oberes Menü veränder - Digital Shadow - 03.05.2008
Hi zusammen
Ich bastel grade an meinem Forum und möchte das Obere Menü gegen diese Grafik samt verlinkten Buttons austauschen. Die Standartbuttons sollen verschwinden und irgendwie muss ich das Ganze dann auch verlinken. Dabei dienen die Schriften in der Grafik nur zur orientierung, verlinkt möchte ich nur die "Picturebuttons".
Die komplette Graifk ist per Dreamwaver 9 erstellt worden (über die Rollover Funktion) und ist als html-dokument gespeichert.
Kann mir da jemand helfen?
Gruß
Digi
RE: Oberes Menü veränder - Michael - 03.05.2008
Wenn der HTML-Code schon vorliegt musst du ihn eigentlich nur noch ins Template header einfügen. Javascript und CSS (falls vorhanden) gehören ins Tempate headerinclude. Die Templates findest du im Admin-CP -> Templates -> Ändern/Entfernen -> *Templateset* -> Ausklappen.
RE: Oberes Menü veränder - Digital Shadow - 03.05.2008
Weiß du genau an welcher stelle es reinmuss ohne den Header rauszuhauen?
Hier ist der html-code
PHP-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=utf-8" /> <title>Unbenanntes Dokument</title> <style type="text/css"> <!-- body { background-color: #000000; margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; } --> </style> <script type="text/javascript"> <!-- 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_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_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('button_startseite_m.png','button_profil_m.png','button_pm_m.png','button_mitglieder_m.png','button_suchen_m.png','button_admin_m.png')"> <table width="950" border="0" cellspacing="0" cellpadding="0" align="center" valign"middle" > <tr> <th width="950" height="149" align="left" valign="top" background="hintergrund.png"><table width="950" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="249" height="114" align="left" valign="top"> </td> <td width="64" align="left" valign="top"><table width="26" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="67"> </td> </tr> </table> <a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Startseite','','button_startseite_m.png',1)"><img src="button_startseite.png" alt="Startseite" name="Startseite" width="59" height="59" border="0" id="Startseite" /></a></td> <td width="10" align="left" valign="top"> </td> <td width="60" align="left" valign="top"><table width="27" height="68" border="0" cellpadding="0" cellspacing="0"> <tr> <td height="59"> </td> </tr> </table> <a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Profil','','button_profil_m.png',1)"><img src="button_profil.png" alt="Profil" name="Profil" width="56" height="56" border="0" id="Profil" /></a></td> <td width="17" align="left" valign="top"> </td> <td width="52" align="left" valign="top"><table width="25" height="74" border="0" cellpadding="0" cellspacing="0"> <tr> <td height="74"> </td> </tr> </table> <a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('PM','','button_pm_m.png',1)"><img src="button_pm.png" alt="PM" name="PM" width="50" height="50" border="0" id="PM" /></a></td> <td width="31" align="left" valign="top"> </td> <td width="76" align="left" valign="top"><table width="61" height="57" border="0" cellpadding="0" cellspacing="0"> <tr> <td> </td> </tr> </table> <a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Mitglieder','','button_mitglieder_m.png',1)"><img src="button_mitglieder.png" alt="Mitglieder" name="Mitglieder" width="71" height="71" border="0" id="Mitglieder" /></a></td> <td width="20" align="left" valign="top"> </td> <td width="55" align="left" valign="top"><table width="31" height="72" border="0" cellpadding="0" cellspacing="0"> <tr> <td height="52"> </td> </tr> </table> <a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Suchen','','button_suchen_m.png',1)"><img src="button_suchen.png" alt="Suchen" name="Suchen" width="54" height="54" border="0" id="Suchen" /></a></td> <td width="19" align="left" valign="top"> </td> <td width="64" align="left" valign="top"><table width="35" height="71" border="0" cellpadding="0" cellspacing="0"> <tr> <td height="71"> </td> </tr> </table> <a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Admin','','button_admin_m.png',1)"><img src="button_admin.png" alt="Admin" name="Admin" width="58" height="58" border="0" id="Admin" /></a></td> <td width="135" align="left" valign="top"> </td> <td width="98" align="left" valign="top"> </td> </tr> </table></th> </tr> </table> </body> </html>
Vielleicht ist jemand so nett mir mein Design zu integrieren ich fühl mich da grenzenlos überfordert grad
RE: Oberes Menü veränder - Michael - 04.05.2008
Versuchs einfach. Wenn es konkrete Probleme gibt, kannst du dich ja jederzeit nochmal melden. Und wenn etwas nicht klappt kannst du das Template ja jederzeit zurücksetzen.
RE: Oberes Menü veränder - Digital Shadow - 04.05.2008
Naja ich habe 2 Sachen jetzt ausprobiert. Einmal den kompletten code in dem Header-Template ersetzt und dann nochmal alles was nicht zum code des Headers gehört (also nur das von den Buttons des oberen Menüs). Beides bringt nichts. Entweder lösche ich etwas wichtiges oder da fehlt was noch dazu. Aber um das rauszufinden bin ich nicht erfahren genug fürchte ich
RE: Oberes Menü veränder - Michael - 04.05.2008
Ersetze im Template header
Code: <a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" /></a>
durch
Code: <table width="950" border="0" cellspacing="0" cellpadding="0" align="center" valign"middle"
>
<tr>
<th width="950" height="149" align="left" valign="top" background="hintergrund.png"><table width="950" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="249" height="114" align="left" valign="top"> </td>
<td width="64" align="left" valign="top"><table width="26" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="67"> </td>
</tr>
</table>
<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Startseite','','button_startseite_m.png',1)"><img src="button_startseite.png" alt="Startseite" name="Startseite" width="59" height="59" border="0" id="Startseite" /></a></td>
<td width="10" align="left" valign="top"> </td>
<td width="60" align="left" valign="top"><table width="27" height="68" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="59"> </td>
</tr>
</table>
<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Profil','','button_profil_m.png',1)"><img src="button_profil.png" alt="Profil" name="Profil" width="56" height="56" border="0" id="Profil" /></a></td>
<td width="17" align="left" valign="top"> </td>
<td width="52" align="left" valign="top"><table width="25" height="74" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="74"> </td>
</tr>
</table>
<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('PM','','button_pm_m.png',1)"><img src="button_pm.png" alt="PM" name="PM" width="50" height="50" border="0" id="PM" /></a></td>
<td width="31" align="left" valign="top"> </td>
<td width="76" align="left" valign="top"><table width="61" height="57" border="0" cellpadding="0" cellspacing="0">
<tr>
<td> </td>
</tr>
</table>
<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Mitglieder','','button_mitglieder_m.png',1)"><img src="button_mitglieder.png" alt="Mitglieder" name="Mitglieder" width="71" height="71" border="0" id="Mitglieder" /></a></td>
<td width="20" align="left" valign="top"> </td>
<td width="55" align="left" valign="top"><table width="31" height="72" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="52"> </td>
</tr>
</table>
<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Suchen','','button_suchen_m.png',1)"><img src="button_suchen.png" alt="Suchen" name="Suchen" width="54" height="54" border="0" id="Suchen" /></a></td>
<td width="19" align="left" valign="top"> </td>
<td width="64" align="left" valign="top"><table width="35" height="71" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="71"> </td>
</tr>
</table>
<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Admin','','button_admin_m.png',1)"><img src="button_admin.png" alt="Admin" name="Admin" width="58" height="58" border="0" id="Admin" /></a></td>
<td width="135" align="left" valign="top"> </td>
<td width="98" align="left" valign="top"> </td>
</tr>
</table></th>
</tr>
</table>
Lösche aus dem gleichen Template:
Code: <div class="menu">
<ul>
<li><a href="{$mybb->settings['bburl']}/search.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/search.gif" alt="" />{$lang->toplinks_search}</a></li>
<li><a href="{$mybb->settings['bburl']}/memberlist.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/memberlist.gif" alt="" />{$lang->toplinks_memberlist}</a></li>
<li><a href="{$mybb->settings['bburl']}/calendar.php"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/calendar.gif" alt="" />{$lang->toplinks_calendar}</a></li>
<li><a href="{$mybb->settings['bburl']}/misc.php?action=help"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/toplinks/help.gif" alt="" />{$lang->toplinks_help}</a></li>
</ul>
Füge am Ende des Templates headerinclude ein:
Code: <style type="text/css">
<!--
body {
background-color: #000000;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
-->
</style>
<script type="text/javascript">
<!--
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_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_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>
Öffne die Datei inc/functions.php und suche nach:
PHP-Code: if($loadpmpopup) { if(my_substr($_SERVER['PHP_SELF'], -strlen("private.php")) != "private.php") { $contents = str_replace("<body", "<body onload=\"Javascript:MyBB.newPM()\"", $contents); } }
Ersetzen durch:
PHP-Code: if($loadpmpopup) { if(my_substr($_SERVER['PHP_SELF'], -strlen("private.php")) != "private.php") { $contents = str_replace("<body", "<body onload=\"Javascript:MyBB.newPM();MM_preloadImages('button_startseite_m.png','button_profil_m.png','button_pm_m.png','button_mitglieder_m.png','button_suchen_m.png','button_admin_m.png')\"", $contents); } } else { $contents = str_replace("<body", "<body onload=\"MM_preloadImages('button_startseite_m.png','button_profil_m.png','button_pm_m.png','button_mitglieder_m.png','button_suchen_m.png','button_admin_m.png')\"", $contents); }
Die Dateiänderung ist nur erforderlich, wenn die Rollovergrafiken vorgeladen werden sollen.
RE: Oberes Menü veränder - Digital Shadow - 04.05.2008
Hm. danke erstmal für die Mühe! Hab das grade Schritt für Schritt befolgt, allerdings wirft er mir jetzt eine Fehlermeldung raus und das Forum zeigt er garnicht mehr an
PHP-Code: Parse error: syntax error, unexpected $end in /www/htdocs/w009cf63/forum/inc/functions.php on line 3979
Ich vermute da klappt was mit der php datei nicht. habe erstmal alles wieder auf standart gestellt.
RE: Oberes Menü veränder - Michael - 04.05.2008
Kann es sein, dass du beim Einfügen des Codes eine geschweifte Klammer vergessen hast?
RE: Oberes Menü veränder - Digital Shadow - 05.05.2008
Hm. eigentlich nicht ich habe es so rauskopiert wie du es hier drin hast. Ich versuchs mal gleich nochmal
RE: Oberes Menü veränder - Digital Shadow - 05.05.2008
Ok ich habe jetzt alles genau so eingefügt wie du gesagt hast. Die Buttons funktionieren jetzt einwandfrei, nur der Header will irgendwie nicht...
Die Innere Tabelle bekomme ich irgendwie nicht so hin das sie wie in diseser Grafik positioniert ist.
Ich versuche es so hinzubekommen dass dann eine Zwischengrafikautomatisch zum Hintergrund hinzugefügt wird, wenn das Forum nach unten "wächst":
So dass die Forumtabelle quasi in diesem verzierten Fenster bleibt und das Design mit der länger des Forums mit nach unten wächst und dann mit dem Header von dem Design abschließt.
Kannst du mir dabei helfen?
|