Verwenden von Zurbs Foundation Tabs als WordPress Nav (Active Tab)

Diese Frage richtet sich mehr an diejenigen von Ihnen, die Erfahrung in der Arbeit mit dem beliebten SASS / JS Framework, Foundation by Zurb, haben. Ich versuche, es als meinen strukturellen core zu meinem neuen WordPress Thema zu verwenden und hatte eine Frage …

In Foundation sind Stylings für Buttons, Formen und natürlich das berühmte 12-Spalten-Raster integriert. Es ist jedoch auch mit jQuery Tabs ausgestattet, mit denen Tabs angezeigt werden können! Nun, ich wollte diese verwenden, um die Navigation meines Themas anzuzeigen, und habe keine Ahnung, wo ich anfangen soll.

Zur Zeit habe ich die unten stehenden:

 

Ich fange wieder mit dem Foundation-Framework an und wie ich feststellen kann, ist dies korrekt, um die tatsächlichen Tabs anzuzeigen … dies ist jedoch nur für reinen Inhalt innerhalb des Tabs – NICHT ein Link zu einem neuen Teil der Site Das zeigt eine aktive Registerkarte für diesen Abschnitt.

Wie kann ich diese Foundation Tab-Logik verwenden und sie mit WordPress verbinden? Wenn ein Benutzer darauf klickt, lädt er diesen Teil der Site und zeigt den korrekten “aktiven” Tab pro Seite an.

Beispiele:

  • Der Nutzer klickt auf “News”> Ein Artikel und ist auf single.php. Der Tab “News” sollte im Abschnitt “News” der Site “aktiv” bleiben.
  • Der Nutzer klickt auf “Kontakt”, wodurch eine WordPress-Seite mit einem Kontaktformular geladen wird. Die Registerkarte “Kontakt” ist aktiv.
  • etc

Jede und jede Hilfe würde sehr geschätzt werden. Wenn Sie nicht wissen, was der Foundation Framework ist, klicken Sie hier , um zu ihrem Dokumentationszentrum und dem Abschnitt Tabs zu gelangen. Ich bin ehrlich zu verlieren und es ist wahrscheinlich vor mir … dachte, ich würde eine Konvertierung öffnen, um zu sehen, ob jemand es sieht. LOL

Danke allen!

Solutions Collecting From Web of "Verwenden von Zurbs Foundation Tabs als WordPress Nav (Active Tab)"

Die Foundation-Registerkarten setzen voraus, dass der anzuzeigende Inhalt bereits in den

  • -Elementen vorhanden ist. Sie könnten mit dieser Annahme gehen und nur Ihre gesamte Website im Voraus laden, aber das wird wahrscheinlich mehr Probleme verursachen als es behebt. Wenn nichts anderes, wird es ewig dauern, um zu laden.

    Eine Option (die Foundation-Seite, auf die Sie verlinkt haben, schlägt dies vor) ist das Design der Registerkarten und den Rest der Seite wie gewohnt mit WordPress & PHP zu laden. Dies bedeutet, dass Sie diesen Teil behalten:

      

    … aber du brauchst das

      . Ändern Sie die href Werte, um eine Verknüpfung zu der Seite href , die Sie anzeigen möchten.

      Dies hat jedoch das Problem, dass jede Seite mit der Registerkarte “Home” geladen wird, die als aktiv markiert ist, sodass Sie sie in eine PHP-Schleife verwandeln und prüfen können, auf welcher Seite Sie sich befinden:

        

      Eine andere Möglichkeit wäre, den Inhalt dynamisch mit Ajax zu laden. Ich bin mit Ajax nicht vertraut, also weiß vielleicht jemand anders, wie man das macht und könnte eine Lösung anbieten?