Auf der Suche nach dem passenden Menü ...

Dies ist Teil 1 des Tutorials
Teil 2 dieses Tutorial lehrt, wie man vertikales Menü bauen + dunklen Farbpalette für die horizontale

Ich beschloss, Thesis Thema zu erhalten, weil einer meiner Kunden mich über Kompatibilitätsprobleme zwischen Thesis und meine Mitgliedschaft Website WordPress Plugin MemberWing. Ich reparierte und dann beschlossen, einen genaueren Blick auf Thesis zu nehmen und sich tatsächlich die Mühe, um Videos auf der Titelseite der Hauptthese Website zu sehen - Diythemes.com.
Was mich am meisten beeindruckte ist die Liebe zum Detail, Benutzerfreundlichkeit und vor allem - SEO-Features, die so gut sind, gedacht.
MemberWing Mitgliedschaft Plug-in wurde von Grund auf für die Mitgliedschaft Websites ausgelegt, die so viel wie möglich SEO Saft ziehen würde. Also zahlte ich viel Liebe zum Vielzahl von SEO-Erweiterungen und Vollkommenheiten in MemberWing. Viele meiner Kunden fragen nach verschiedenen Themen zu nutzen und mit Thema, das so gut war SEO aus der Tiefe optimiert wäre eine ausgezeichnete Ergänzung für die Mitgliedschaft Portal Unternehmer.

Das Kombinieren der SEO Befugnisse MemberWing mit SEO Befugnisse der Thesis Thema würde die beste Klassierung Möglichkeiten, meine Kunden zu geben. Also habe ich Thesis und spielte mit ihm für einen Tag.

Es ist ein hervorragendes Thema in allen ihren Formen. Die Navigation Teil davon ist jedoch ein wenig in der Funktion eingeschränkt. Ausgehend von Thesis 1.5 + ist es nur eine Ebene im Menü. Mein Wunsch ist es, immer in der Lage, Navigation anpassen, so viel wie nötig. Einige Websites haben nur wenige Seiten, viele andere haben Tonnen von statischen Seiten + Abermillionen von Artikeln / posts + viele Kategorien.
So in idealen Welt mit einer Chance, gut aussehende hierarchisch organisiert benutzerfreundliche Navigation im Menü erstellen, ist ein Muss. These auf Anhieb eine gute Navigation suchen, aber ich merkte, dass alle Thesis-Websites suchen, wie Zwillinge. Customizing Thesis Navigations-Menü ist nicht wirklich einfach so dass die meisten Menschen so zu lassen, wie es ist. Es gibt keine Möglichkeit zur Ordnung der Kategorien im Menü ändern oder sie in Position zwischen den Seiten. Und wieder ist die Fähigkeit, verschachtelte Menüstrukturen zu erstellen fehlt. Also entschied ich mich zu sehen, was könnte man dagegen tun werden.
Nachdem er über ein halbes Dutzend Menü / Navigation libaa ich meine Wahl auf Wordpress Plugin List Navigation NAVT.
NAVT Plugin ist im Wesentlichen ungeordnete Liste Generator mit super Phantasie und ein bisschen schwer zu Figur unkonventionelle Admin-Interface. Was irreführend ist, daß es nicht in Wirklichkeit zu Lust hast Menüs für sich. Es ist der schwierigste Teil der Arbeit aber - gibt Ihnen die Fähigkeit, visuell an einem Strang ziehen, und erzeugen ungeordnete Liste - Skelett Ihr Menü-to-be. Und Sie können viele Menüs zu erstellen. Sie können alle Arten von Wordpress Zeug in der Navigation im Menü ziehen: Seiten, Beiträge, Artikel, Kategorien, Benutzer, Code-Blöcke, externe Links, Trennwände, Separatoren und Mix and Match und nisten und zu ordnen und anpassen, sie in irgendeiner Baumstruktur Sie wollen.
NAVT generiert für Sie "HTML" ungeordnete Liste geführt. Zweite Schönheit NAVT ist, dass es hilft Ihnen, Ihre neue Menü in Ihrem Thema einfügen über berühmte JQuery basierter Logik, sondern, ohne dass irgendwelche Code ändern! NAVT können Sie angeben: "Ersetzen Sie diese # Element mit meinem neuen NAVT-Menü". # Element könnte eine ID oder die Klasse der Weg der vorhandenen Menüs oder div-Element-Tag, der von Ihrem aktuellen Thema erzeugt wird. So geht diese NAVT Ersatz für Sie ohne dass Sie in Thema Code gehen und es chaotisch, als es ohnehin schon ist. Wenn das alles klingt wie Kauderwelsch - keine Sorgen machen - ich werde Sie Schritt für Schritt bald. Der schwierigste Teil des NAVT für jeden ist, dass Sie kommen mit den tatsächlichen CSS + Bilder + JavaScript-Code für Ihr Menü selbst finden. Und es liegt an Ihnen, um herauszufinden, wo und wie diese Dateien zu integrieren und machen diese Dinge richtig zusammen zu vernetzen.
Mit freundlichen Grüßen, ohne zu wissen einige JQuery + PHP + + CSS unter menschenwürdigen Erfahrungen mit Wordpress - dieses Ding ist schwer zu ziehen.
Gerne Ich weiß, diese Dinge ein wenig so dass ich beschloss die Kugel und Führer der Menschheit in die Freiheit zu beißen beim Aufbau der Besten der Besten Navigationsmenüs für Wordpress. Ich musste herausfinden, Quellen für einige gut aussehende horizontalen CSS-Menüs. Ich nahm Dynamic Drive Website für die beste Auswahl, Demos und Quellen.

Ich widmete ein Tag zu Diplomarbeiten und spielen mit NAVT Plugin-Studie. Am Ende habe ich stolz erstellten benutzerdefinierten, flexibel, SEO optimiert, mehrstufige, verschachtelte Navigaton springen Struktur für mein Wordpress + Diplomarbeit basierten Site.

Liste der Funktionen von mehrstufigen, verschachtelte Wordpress Navigationsmenü für Diplomarbeit Thema
(You Got to love this stuff):

• Professionelle, saubere Optik und Haptik.
• Unterstützung von allen modernen Browsern, einschließlich 6,7 MSIE, Opera, Safari, Firefox 3.x, Google Chrome in beiden Javascript-und Nicht-Javascript-Modi.
• Anmutig downgradable für Nicht-Browser Javascript. Sie Menü wird benutzt werden, ist optisch ähnlich und Arbeitsbedingungen auch für JavaScript-fähige Browser (wenn auch nur Top-Level-Navigation sichtbar sein wird und keine Flyouts wird natürlich vorkommen, wie sie von Javascript gemacht werden).
• SEO freundliche Funktionen - ungeordnete Liste im Menü-Code ist in HTML erstellt. Google und andere Suchmaschinen können Sie dem Index Ihrer Navigationsstruktur und finden Sie Links zu den inneren Seiten.
• Support für eine unbegrenzte Verschachtelung Ebenen und Unterstufen.
• Support für jede Bestellung oder Seiten, Beiträge (über benutzerdefinierte URIs), Kategorien, Benutzer, benutzerdefinierte Code-Blöcke und externe Links im Menü.
• Unterstützung von Text-als auch Image-Menü-Elemente. (Ich habe diesen aber noch nicht ausprobieren).
• Menü-Struktur und der Inhalt wird visuell einstellbar über NAVT Admin-Bereich.
• Kompakt: JQuery basierter Flyouts für verschachtelte Ebenen.
• Schnell: JQuery für das Menü von Google-Servern geladen ist (ich Thesis Liebe selbst die gleiche Stelle zu ziehen es vor Ort zu tun). Dadurch würden die Dinge ein wenig.
• Skalierbarkeit - Diese Art von Menü ist editierbar und konfigurierbar jederzeit über NAVT Plugin-Einstellungen, ohne dass der Codierung überall.

Ich habe diesen ausgezeichneten Menü von Dynamic Drive-Portal als eine Basis. Ich musste Javascript-Code ein wenig anpassen, sowie Stück von PHP-Include in custom_functions.php, damit es funktioniert mit Thesis. Auch die Zahl der bereits bestehenden Seiten, Kategorien und Beiträge von meiner Website wurden verwendet, um Menü-Struktur zu sammeln. Ihre Website Besonderheiten wird anders sein - sondern Konzepte werden die gleichen sein.
Lassen Sie gehen, so sind wir?

Schritt für Schritt Anweisungen zur Einrichtung NAVT-basierte verschachtelten, anpassbare, Multilevel-, SEO-friendly
und einfach nur cool looking Navigationsmenü für Wordpress und Thesis Theme

1. Go to Wordpress Admin-Panel. Plugins-> neue Suche hinzufügen "NAVT". Das Plugin wird angezeigt. Klicken Sie auf [Install], [Jetzt installieren], "Aktivieren Plugin".
2. Extras-> NAVT Listen, Inside "Navigation Group"-Bereich finden "Gruppenname" und geben ein: "menu1" in das Feld, drücken Sie [Erstellen]-Taste. "Menu1" Rechteck-Bereich erstellt hat.
   Diese "menu1"-Bereich werden die wichtigsten Spielplatz für die Menü-Aufbau. Sie werden Drag & Drop hier Ihr Menü-Elemente.
3. In "Vermögenswerte" Bereich zu finden "andere" Listenfeld und klicken Sie auf "Home"-Wahl. "Home"-Ding wird innerhalb erscheint "unassigned" Bereich. Weird, eh? Kein Problem, solange es funktioniert - und es wird für uns.
4. Ziehen Sie diese "Home"-Ding von "Assets" in Bereich "menu1" Rechteck Bereich. Es wird "Home"-Option im Menü.
   • Wiederholen Sie die Schritte 3-4 für einige Seiten von "Seiten"-Bereich, sowie für die Klassen in "Kategorien" Bereich. Ziehen Sie alle anderen Artikel, die Sie wollen in Ihrem Menü inside "menu1 werden" Rechteck. Sie können klicken Sie auf den Seiten, Kategorien, Benutzer und einige benutzerdefinierte Elemente wie "Liste Teiler" und "Code-Block". Code-Block ist cool hin zum Custom-Schnipsel im Menü hinzuzufügen.
   • Sie können Menüpunkte in "menu1 Drag"-Bereich, um ihre Reihenfolge zu ändern.
   • Sie können hierarchische Position eines jeden Menüpunkt mit "anpassen <" und ">" Pfeile.
   • Mit einem Klick auf den Text Namen der einzelnen Menüpunkt - öffnet das übersteigt jede Vorstellungskraft Anpassungsdialogfeld extra für diesen Artikel. Ich meist standardmäßig verwendet, aber technisch kann man verrückt werden und beginnen Sie, Image-Menüoptionen und fügen Sie Stücke von HTML-Code ein. Proceed with caution though.
   • Für linkless unclikable Untermenüs, die als "Eltern" für andere "sub-Kinder" ich "Code-Block" Art dienen. Zum Beispiel, wenn Customizing-Code-Block wie Artikel, den ich trat für "Menüoption alias" = "MemberWing" und "Enter Code-Block:" = "<a href='#'> MemberWing </ a>". Gestützt href = "#" wird es nicht angeklickt werden, sondern als eine gültige "Eltern"-Menüwahl.
5. Hier ist, wie meine NAVT 'build menu1 "Struktur sah aus wie fast abgeschlossen:
   
6. Finish ursprünglichen Gebäude und klicken Sie dann auf "Gang"-Symbol auf Ihrem Menüstruktur anpassen:
   
7. Es wird offene Dialog mit 4 Registerkarten: Optionen, Display, CSS, Theme.
   1. Gehen Sie auf "Optionen" und stellen Sie sicher, dass alles, was nicht aktiviert ist und "Gruppen-Name", sagt: "menu1"
   2. Gehen Sie zu "Display" und sicherzustellen, dass alles auf den "Show-Gruppe Navigation auf ..." Bereich aktiviert ist [x]. Lassen Sie den Rest auf den Standardwerten.
   3. Gehen Sie zu "CSS" und wählen Sie Radio-Button (x) "gelten nicht CSS-Klassen".
   4. Gehen Sie zu "Theme" aus und füllen Sie es in etwa so aus:
      
      Insert into "Tags hinzufügen, bevor ..."-Bereich diesen Code ein:
      <div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
      Insert into "Tags hinzufügen nach dem ..."-Bereich diesen Code ein:
      <br style='clear: left' /></div>
   5. Drücken Sie [Speichern / Schließen]
8. An diesem Punkt im Menü Gebäude von innen NAVT Plugin-Optionen abgeschlossen ist.
   Jetzt ist es an der Zeit, eine kleine Melodie einen für Thesis Thema, um es fertig zu werden. Dafür brauchen wir ein paar benutzerdefinierte Dateien hinzufügen - CSS und JavaScript, um das Menü gehört und aktualisieren custom_functions.php Thesis "
9. Laden Sie die Dateien hier komplettes Set.
10. Entpacken Sie Archiv. Wenn Sie Ihr custom_functions.php mit Ihren Anpassungen aktualisiert - Sie brauchen, um sie mit meinen Sachen zu verschmelzen. Ich lasse es an Ihnen.
    Wenn Sie noch nicht berührte ihn - Sie können ihn mit mir zu überschreiben. Bitte beachten Sie: Ich zog Menü unter dem Website-Header (Standard ist vor Standpunkt) - so meine Anpassung für diese Einstellung auch.
11. Upload-Archiv mit allen Unterverzeichnissen und Dateien unter Ihrer Thesis Thema 'custom' Verzeichnis, wie folgt aus:
    .../themes/THESIS-DIR/custom/custom_functions.php
.../themes/THESIS-DIR/custom/jquerycssmenu/...
    Ich habe nicht berührt custom.css - Ich ziehe es vor zu halten Menü-spezifische CSS unter ihren eigenen Standorten zu vermeiden, Chaos in custom.css
12. An dieser Stelle können Sie Ihre Webseite laden und zu sehen, neue schöne neue mehrstufige, verschachtelte, SEO optimiert Menü.
13. Sie können immer wieder zum NAVT Einstellungen und passen Sie Ihr Menü mit einer größeren Auswahl oder neu zu positionieren hat. Es wird sich auf Live-Website automatisch berücksichtigt werden.

Der Weg nach vorn ...

Dieser Lehrgang beinhaltete auch kreative Beispiel für eine Art Menü. Ich spielte mit einem anderen - so, wie dunkel gefärbt Menü sehen würde so aussehen:

Thesis Thema - Multilevel verschachtelte CSS-Menü - dunkle Palette

Ich glaube, es ist recht nett. Es gibt viele weitere Navigations-Proben finden Sie unter Dynamic Drive - alle von ihnen sind möglich, für Diplomarbeiten und andere Wordpress Themen mit einiger Anstrengung anpassen:

Dynamic Drive Horizontale Menüs

Ich hoffe, Sie finden diese Anleitung nützlich und sinnvoll. Wie ich bereits sagte, ist es möglich, jede dieser Menüs für Thesis anpassen - gegeben ist, dass Zeit und Lust, um sie geschehen.

Ich könnte diese Arbeit für Sie tun auf der Grundlage von Verträgen. Wählen Sie einfach den Menü Sie möchten, kontaktieren Sie mich und ich werde auf den Code und Anweisungen für Ihre Website zu arbeiten.

$ 20

Und natürlich, wenn Sie bis zum Aufbau super SEO optimiert Premium-Mitgliedschaft wordpress Portal - die beste Lösung für Sie:
Diplomarbeit Thema + MemberWing Mitgliedschaft Plugin + selbst gehosteten Wordpress natürlich.

Tagged als: CSS-Menü für WordPress, Thema Diplomarbeit, Dissertation Thema hierarchischen Menüs, Diplomarbeit Thema Multilevel-Menü, Diplomarbeit Thema Navigaton springen, Diplomarbeit Thema verschachtelten Menüs, Diplomarbeit Thema Tutorial, wordpress css menu, wordpress verschachtelte Menü