Menü mit eigenem Design

Hallo!

Ich habe mir ein Menü erstellt, und möchte nun, dass ich das in Wordpress integrierte Menümodul verwenden kann um meine Seiten per Drag&Drop zum Menü hinzu zu fügen -> das Design sollte allerdings mein eigenes sein.

Hier meine CSS zum Design:

#abc-textnavi ul {list-style-type: none; margin:0 auto; width:950px; padding-top:10px;}
li.textnavi {float: right;}
a.textnavi {display:block; /* important for IE */ text-decoration: none; color:#000; font-weight:bold; font-size:115%; padding: 7px 0 4px 15px; margin-left:15px; background: url("img/textnavi_normal.png") no-repeat left top;}
a.textnavi span{padding: 7px 15px 4px 0; margin: 0; background: url("img/textnavi_normal_rechts.png") no-repeat right top;}
a.textnavi:hover, #navi li.current a {color:#ffffff; background-image: url("img/textnavi_hover.png");}
a.textnavi:hover span, #navi li.current a span {background-image: url("img/textnavi_hover_rechts.png");}

Und hier das Menü, wie ich es bisher eingebunden habe (allerdings muss ich so die Menüpunkte mit dem Editor ändern und kann nicht das Menümodul von Wordpress verwenden)

<div id="abc-textnavi">
    <ul>
        <li class="textnavi"><a class="textnavi" href="index.php" title="Startseite"><span>Home</span></a></li>
        <li class="textnavi"><a class="textnavi" href="seite2.php" title="Menüpunkt2"><span>Menüpunkt2</span></a></li>
        <li class="textnavi"><a class="textnavi" href="seite3.php" title="Menüpunkt3"><span>Menüpunkt3</span></a></li>
    </ul>
</div>

Ich hoffe das ist zu machen und Ihr könnt mir helfen!
Vielen Dank schon mal im Vorhinein.

LG,
Mario

Also ich nutze ein selbst geschriebene Theme!

Ich kann mein Menü ja ohne Probleme z.B. in die header.php einbinden, nur wenn ich dann einen neuen Menüpunkt hinzufügen muss, muss ich immer zur header.php gehen und dort die Codes einfügen.
Ich möchte aber, dass ich das ganz einfach im WP-Admin unter Menüs machen kann. Also einfach Seite auswählen und zum Menü hinzugfügen -> dann sollte der neue Menüpunkt in meinem Design auf der Site stehen?!

Das ganze ist Momentan noch im Aufbau und als Test installiert: http://www.minirockevents.at/test

Ok, ehrlich gesagt - ich check mich da nicht wirklich durch :/

Könnte mir jemand behilflich sein? Den Code zu meinem Menü (CSS und wie es eingebunden wird) habe ich oben gepostet...

Dankeschön im Vorhinein,
Mario

Zitat von maxe

danach hast du die Menü-Funktion von WP und musst sie nur noch richtig stylen.

Danke für die Info. Aber das weis ich, wie ich das Menü einbinde.
Mir geht es darum wie ich dieses Menü genau in meinem Style bekomme?

Mein Menü muss genau so aussehen:
[COLOR=#000080]<li class=[COLOR=#0000FF]"textnavi"[/COLOR]>[/COLOR][COLOR=#008000]<a class=[COLOR=#0000FF]"textnavi"[/COLOR] href=[COLOR=#0000FF]"index.php"[/COLOR] title=[COLOR=#0000FF]"Startseite"[/COLOR]>[/COLOR][COLOR=#000080]<span>[/COLOR]Home[COLOR=#000080]</span>[/COLOR][COLOR=#008000]</a>[/COLOR][COLOR=#000080]</li>[/COLOR]

Aber das Menü was Wordpress erstellt sieht ja von der Struktur her ganz anders aus...

Das Menü habe ich von einem Onlinetut nachgebaut.

Ob ich das schaffe, dieses an das Wordpressmenü anzupassen...ich bin mir nicht sicher...

Oder hat jemand eine Lösung, wie ich so ein Menü so einfach wie möglich hinbekomme?
So wie ich es jetzt geschrieben habe, ist es ja recht einfach, aber Wordpress verwendet da ja eine andere Abfolge scheinbar...d.h. ich kann mein Menü so wie es jetzt ist vergessen und muss die Klassen irgendwie an die von Wordpress anpassen?!? Oh man... :/

:D also wie ich ein einfaches Menü genau in der von Wordpress vorgegebenen Struktur baue, ist mir bekannt, danke!

Aber ich möchte ein Menü mit Hintergrundbild erstellen, welches abgerundete Ecken und Farbverlauf haben soll beinhaltet. Ausserdem soll es in der Länge variabel sein.

Das bedeutet, dass ich pro Menüpunkt 2 Hintergrundbilder verwenden muss, und wie ich das mit der von Wordpress vorgegebenen Struktur hinbekomme, weis ich leider nicht!

Meine Menüstruktur, die auch mit den Hintergrundbildern funktioniert sieht so aus:

<div id="abc-textnavi">
    <ul>
        <li class="textnavi"><a class="textnavi" href=""><span>Menupunkt 1</span></a></li>
        <li class="textnavi"><a class="textnavi" href=""><span>Menupunkt 2</span></a></li>
        <li class="textnavi"><a class="textnavi" href=""><span>Menupunkt 3</span></a></li>
    </ul>
</div>

Und die Struktur von Wordpress sieht bei mir so aus:

<div class="menu-hauptmenu-container">
    <ul id="menu-hauptmenu" class="menu">
         <li id="menu-item-7493" class="menu-item  menu-item-type-post_type menu-item-object-page current-menu-item  page_item page-item-2 current_page_item menu-item-7493"><a  href="">Menupunkt 1</a></li>
        <li  id="menu-item-7492" class="menu-item menu-item-type-post_type  menu-item-object-page menu-item-7492"><a href="">Menupunkt  2</a></li>
        <li id="menu-item-7494"  class="menu-item menu-item-type-post_type menu-item-object-page  menu-item-7494"><a href="">Menupunkt 3</a></li>
    </ul>
</div>

Hat vielleicht jemand einen Tipp, wie ich mein Menüdesign auf die einzelnen Wordpress-Klassen und IDs einbringe?

LG,
Mario

Danke für eure Hilfe und Mühe...ich habs schon geschafft, ganz simple und easy ;)

ul#menu-hauptmenu {list-style-type: none; margin:0 auto; width:930px; padding-top:10px;}
li.menu-item {float: right; height:40px; line-height:40px; background:url('img/textnavi.png') no-repeat; margin-left:5px;}
li.menu-item:hover{background:url('img/textnavi_hover.png') no-repeat;}
li.menu-item a{color:#000; font-weight:bold; font-size:110%; text-decoration:none; display:block; background:url('img/textnavi_rechts.png') no-repeat top right; padding:0 10px;}
li.menu-item a:hover{color:#fff; background:url('img/textnavi_hover_rechts.png') no-repeat top right;}

LG,
Mario