Indlæs de seneste indlæg efter kategori via WordPress-menu ved hjælp af jQuery-belastning

jquery

Hvis du har besøgt nogle af de større blogs derude som Mashable, bemærker du muligvis, at de har et meget flot menusystem, der falder ned og giver dig synlighed i de nyeste blogindlæg fra hver kategori. For at sikre, at siden ikke tager for evigt at indlæse, indlæser de det indhold ved hjælp af Ajax ... og indlæser det først, når siden er fuldt indlæst.

WordPress Ajax undermenu

Vi ønskede at gøre det samme her Martech Zone. For at give et indblik i de kategorier, vi har, ville jeg vise nogle indlæg inden for hver. Vi er fortrolige med WordPress, WordPress API og jQuery, men det var først, da jeg fandt en artikel om Henter indlæg efter kategori ved hjælp af jQuery at vi havde en god løsning.

BEMÆRK: Et aspekt af deres metode, som jeg ikke tror er en god løsning, er at sende hele query_post-strengen via JavaScript ... det ser ud til, at du åbner dig selv for en hacking! Jeg har ændret scriptet til dette websted, så jeg kun videregiver de nødvendige parametre inden for kommandoen query_posts.

Vejledningen trin brugeren gennem oprettelse af en skabelon til dynamisk at trække indlæg, og derefter hvordan man bygger links, der kan starte anmodningen. Det ville have været let, hvis vi bare ville lave nogle links, men vi ville faktisk bruge WordPress 'indbyggede navigationsmenu. Desværre for os har WordPress 'menulinks genereret numre, når du tilføjer og fjerner menupunkter ... men de har faktisk ingen oplysninger om den kategori, du ønsker at trække og videregive i dit Ajax-opkald.

For at mærke menuelisteelementerne korrekt, inkorporerede vi koden fra WPreso, Tilføj side / post slug klasse til menupunktklasser.

Kun et problem ... det fungerer for siden eller indlægget, men virkede faktisk ikke for kategori! Så vi opdaterede anmodningen om slug med:

$ slug = get_cat_slug ($ id);

Og tilføjede funktionen fra WPRecipes, WordPress-trick: Få kategorislug ved hjælp af kategori-id, for at trække kategorisluggen tilbage i en dataattribut i navigationsmenuen.

Så ... takket være samarbejdsindsatsen fra 3 WordPress-websteder og nogle finjusteringer fra vores jQuery-guru på DK New Media, Stephen Coley (for at udjævne menuen) har vi et meget flot undermenu-system!

Alt arbejdet blev udført inden for vores temafiler. Vi indlæste navigationsmenufiltrene i functions.php, tilføjede undermenu div til vores temas header.php-fil, tilføjede en undermenu-skabelon til vores dem og indlæste en undermenu JavaScript-fil i vores header - hvilket sikrer, at jQuery allerede er indlæst i vores tema såvel. Håber du sætter pris på arbejdet, det var en sjov opdatering til siden!

8 Kommentarer

  1. 1

    Viser eller sælger du denne kode et eller andet sted? Jeg har forsøgt at få det til at fungere, men jeg kan ikke finde ud af, hvordan jeg sætter mig ind i wp_nav_menu med en rullator ...

  2. 6
  3. 8

Hvad mener du?

Dette websted bruger Akismet til at reducere spam. Lær, hvordan dine kommentardata behandles.