Eigenes CSS-Menü einbinden

von Jats Sa 3 Apr 2010 - 11:38

Hey,

ich habe mit Hilfe von www.cssmenumaker.com ein neues Menü für miene Homepage erstellt.
Leider weiß ich nicht, wie ich es einbinden kann.

Selbstverständlich müsste man das "Standard-Menü" entfernen (wie auch immer) und erst dann würde das ganze einigermaßen aussehen.
Aber ich finde keine Möglichkeit,das neue Menü so einzibinden, dass es korrekt angezeigt wird ..
ich habe bereits eine HMTL-Seite erstellt, die nicht an das Standard-Design angelegt ist, bei der ich dann das "Standard-Menü"
entfernen konnte, aber ich habe es noch nicht geschafft, mein Menü sauber und ordentlich auf einer HTML-Seite darstellen zu lassen.

Ich bin mir nicht sicher, ob es überhaupt möglich ist, das Menü so einzubinden, aber hier ist mal der Code:

Code:: <html> <head> <style type="text/css"> <!-- .menu{ border:none; border:0px; margin:0px; padding:0px; font: 67.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif; font-size:14px; font-weight:bold; } .menu ul{ background:#333333; height:35px; list-style:none; margin:0; padding:0; } .menu li{ float:left; padding:0px; } .menu li a{ background:#333333 url("images/seperator.gif") bottom right no-repeat; color:#cccccc; display:block; font-weight:normal; line-height:35px; margin:0px; padding:0px 25px; text-align:center; text-decoration:none; } .menu li a:hover, .menu ul li:hover a{ background: #2580a2 url("images/hover.gif") bottom center no-repeat; color:#FFFFFF; text-decoration:none; } .menu li ul{ background:#333333; display:none; height:auto; padding:0px; margin:0px; border:0px; position:absolute; width:225px; z-index:200; /*top:1em; /*left:0;*/ } .menu li:hover ul{ display:block; } .menu li li { background:url('images/sub_sep.gif') bottom left no-repeat; display:block; float:none; margin:0px; padding:0px; width:225px; } .menu li:hover li a{ background:none; } .menu li ul a{ display:block; height:35px; font-size:12px; font-style:normal; margin:0px; padding:0px 10px 0px 15px; text-align:left; } .menu li ul a:hover, .menu li ul li:hover a{ background:#2580a2 url('images/hover_sub.gif') center left no-repeat; border:0px; color:#ffffff; text-decoration:none; } .menu p{ clear:left; } </style> </head> <body> <ul id="menu"> <li><a href="http://www.anonym.to/?http://zettelforum.1talk.net/forum.htm" target="_self">Home</a></li> <li><a href="http://anonym.to/?http://zettelforum.1talk.net/portal.htm" target="_self">Portal</a></li> <li><a href="http://anonym.to/?http://zettelforum.1talk.net/calendar.forum" target="_self">Kalender</a></li> <li><a href="http://anonym.to/?http://zettelforum.1talk.net/faq.htm" target="_self">FAQ</a></li> <li><a href="http://anonym.to/?http://zettelforum.1talk.net/search.forum" target="_self">Suche</a></li> <li><a href="http://anonym.to/?http://zettelforum.1talk.net/memberlist.forum" target="_self">Members</a></li> <li><a href="http://anonym.to/?http://zettelforum.1talk.net/groupcp.forum" target="_self">Gruppen</a></li> <li><a href="http://anonym.to/?http://zettelforum.1talk.net/profile.forum?mode=editprofile" target="_self">Profil</a></li> <li><a href="http://anonym.to/?http://zettelforum.1talk.net/msg.forum?folder=inbox" target="_self">Postfach</a></li> <li><a href="http://anonym.to/?http://zettelforum.1talk.net/login.forum?logout=true&sid=603a56aec4f3a53603c559f4c95100d3&key=865779\\\\" target="_self">Login/Logout</a></li> </ul> </body>

Jetzt habe ich bei einem kostenlosen Domain-Anbieter eine Testseite erstellt und dort mein Menü eingefügt und dort wird es einwandfei dargestellt.
Was mache ich falsch ?

Vielen Dank schonmal

von #Frank Sa 3 Apr 2010 - 15:11

Es ist zwar möglich dieses Menü, das du dort eingestellt hast auf dein Forum zu installieren, aber nun kommt es.
Wenn du dein Menü so bearbeitest, dann hast du das Problem, das erst mal zwei Schaltflächen nicht funktionieren. Das ist zum einen die Schaltfläche PN b.z.w. neue PN und dann noch Login und Logout.
Da es sich um einen Hover Menü handelt, solltest du mal hier im Forum Suchen, ob dort etwas für dich dabei ist.
Diese Frage wurde schon oft gestellt und auch einiges an Lösungen wurde vorgeschlagen.
Eventuell ist was für dich dabei.

von Jats Sa 3 Apr 2010 - 16:06

#Frank schrieb:Es ist zwar möglich dieses Menü, das du dort eingestellt hast auf dein Forum zu installieren, aber nun kommt es.
Wenn du dein Menü so bearbeitest, dann hast du das Problem, das erst mal zwei Schaltflächen nicht funktionieren. Das ist zum einen die Schaltfläche PN b.z.w. neue PN und dann noch Login und Logout.

Da hab ich auch schon dran gedacht, weil mir der Link der 2 Schaltfächen aufgefallen ist.
Ich könnte das dann vielleicht noch irgendwie anders bewerkstelligen, aber ich werde die Suche nochmal missbrauchen, auch wenn ich bei den ersten Anläufen nichts gefunden habe Wink

von #Frank Sa 3 Apr 2010 - 16:12

Wenn du auf diesen Button klickst:

Dann werden dir einige Themen zu deiner Frage angezeigt.
Eventuell ist was für dich dabei.

von Jats Sa 3 Apr 2010 - 16:20

Ich hab zwar was gefunden, aber ich denke, ich werde da sehr viel tüfteln müssen ..

Du hattest in einem Beitrag geschrieben, dass man da Standard-Menü in den Templates entfernen könne .. kannst du mir sagen wo ?
Ich habe zwar, bereits auf einer einzelnen HTML-Seite das Menü entfernen können, aber ich bin mir nicht sicher, unter welchem Template ich es für's ganze Forum finde.

von #Frank Sa 3 Apr 2010 - 17:07

Du findest die Tabelle mit dem Menü im Template:
overall_header_new
an dieser Stelle:

Code:: <table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}"> <tr> <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td> </tr> </table>

Hier könntest du auch den Code deines Menüs einsetzen, oder deine Menüseite in einen Iframe ohne Scrollbalken.
Du kannst ja mal ein wenig versuchen, wie du das am besten hin bekommst.
Wenn du keine Zusätzlichen Buttons in deiner Menüleiste hast, dann kann aber auch diese Version für dich Interessant sein:
https://hilfe.forumieren.com/sammlung-scripts-codes-und-template-anderungen-f19/css-navibar-jeden-button-einzeln-hovern-t17532.htm

von Jats Sa 3 Apr 2010 - 17:34

Okay, ich werde beides mal ausprobieren Wink

von #Frank Sa 3 Apr 2010 - 17:58

Ich sehe, das du die Zweite Methode ausprobierst. Aber denke daran, das du die Höhe und die Breite dort angeben must:

Code:: #i_icon_mini_index{ background-image:url(Standard bild-URL); height:29px; } #i_icon_mini_index:hover{ background-image:url(http://www.abload.de/img/homeidol.png); height:35px;

Hier hast du noch nicht alle Bilder eingesetzt, und auch die korrekten Angaben zu Hohe und Breit fehlen noch.

von Jats Sa 3 Apr 2010 - 18:30

#Frank schrieb:Ich sehe, das du die Zweite Methode ausprobierst. Aber denke daran, das du die Höhe und die Breite dort angeben must:
Code:
#i_icon_mini_index{ background-image:url(Standard bild-URL); height:29px; } #i_icon_mini_index:hover{ background-image:url(http://www.abload.de/img/homeidol.png); height:35px;
Hier hast du noch nicht alle Bilder eingesetzt, und auch die korrekten Angaben zu Hohe und Breit fehlen noch.

Ich habs gemerkt ^^
Als ich dann aber alle Bilder eingefügt hatte (mit Höhe und Breite), sah es so aus:

Eigenes CSS-Menü einbinden Mistym4a

Also bis zu "Kalender" war noch alles da, aber ab da, war alles nach rechts versetzt und hat gefehlt.
Was hab ich falsch gemacht ?
by the way -> Ich habe jetzt erstmal das alte Theme eingefügt, falls du dich wunderst Wink

von Jats Sa 3 Apr 2010 - 18:48

Ist schon gut, ich habe meinen Fehler selbst gefunden knock

Ich hab die Simikolons bei der Bestimmung der Breite von manchen Buttons einfach vergessen -.-

Ich seh jetzt mal, wie das wird, aber es nimmt Form an .. danke nochmal top

von #Frank So 4 Apr 2010 - 0:45

An bitte sieht doch sehr schön aus. dann schließe ich hier erst mal.

	Neue Beiträge seit dem letzten Besuch.	
	Textbausteine des MODERATIONSTOOL	
	AB > PFAD > GENERATOR	
	FORUM > PFAD > GENERATOR	
	Unterstützung Lösungs-Probleme	
	Auffällige User	
	Der Runde Tisch	
	HÄUFIG GESTELLTE FRAGEN	

Eigenes CSS-Menü einbinden

Eigenes CSS-Menü einbinden

Re: Eigenes CSS-Menü einbinden

Re: Eigenes CSS-Menü einbinden

Re: Eigenes CSS-Menü einbinden

Re: Eigenes CSS-Menü einbinden

Re: Eigenes CSS-Menü einbinden

Re: Eigenes CSS-Menü einbinden

Re: Eigenes CSS-Menü einbinden

Re: Eigenes CSS-Menü einbinden

Re: Eigenes CSS-Menü einbinden

Re: Eigenes CSS-Menü einbinden