In deze zelfstudie laat ik je de basis zien van het gebruik van de plug-in Advanced Custom Fields (ACF). ACF is een behoorlijk grote plug-in, dus dit artikel zal absoluut niet alles uitleggen wat het biedt, maar het zou voldoende moeten zijn om je op weg te helpen met het toevoegen van je eigen metadata en het te tonen in je thema.
Op het moment van schrijven zijn er twee versies van ACF: 4 en 5. Dit artikel is gebaseerd op versie 4, maar zou ook moeten gelden als u versie 5 gebruikt.
Geavanceerde aangepaste velden is een gebruikersinterface voor het toevoegen van aangepaste velden of metagegevens aan WordPress. Met aangepaste velden kunt u uw berichten of pagina's uitbreiden met meer gegevens. Laten we naar een veelvoorkomend scenario kijken:
U hebt een berichttype gebeld film
en u wilt een score van tien bij elk van uw beoordelingen toevoegen, samen met andere gegevens. Nu kunt u deze gegevens gewoon in uw bericht opnemen, maar wat als u deze gegevens later op een andere manier wilt gebruiken? Misschien wilt u de score boven uw beoordeling verplaatsen; in dit geval zou je elke beoordeling handmatig moeten bewerken en deze score handmatig moeten verplaatsen - niet geweldig.
WordPress heeft wel ingebouwde functies voor het maken van aangepaste velden, maar deze bevatten alleen basisfunctionaliteit en vereisen dat er programmeervelden worden gemaakt. ACF heeft veel ingebouwde veldtypen, waaronder enkele:
Naast het hebben van ingebouwde velden, biedt ACF u een selectie van regels die kunnen worden gebruikt om te bepalen waar velden worden weergegeven in uw WordPress-beheerder. Dit is echt handig om je admin-omgeving zo schoon mogelijk te houden. U kunt bijvoorbeeld alleen een groep aangepaste velden weergeven als uw berichttype dit is beoordelingen
en je paginasjabloon is aanbevolen recensie
.
Voordat we beginnen met het toevoegen van een aantal velden, moet u de ACF-plug-in installeren. Om dit te doen, gaat u vanuit het WordPress-dashboard naar Plug-ins> Voeg nieuw toe. Van de Plugin toevoegen scherm, zoek naar Geavanceerde aangepaste velden en klik Installeren. Zorg ervoor dat u de plug-in activeert: als deze correct is geïnstalleerd, ziet u nu een Aangepaste velden menu in uw WordPress-beheerder.
Vasthouden aan het thema van een website voor filmrecensies, gaan we een aantal relevante velden maken. Om deze tutorial te volgen, heb je een aangepast berichttype nodig film
. Voor meer informatie over het maken van berichttypen, ga je naar dit andere geweldige Tuts + -artikel. Dat gezegd hebbende, de hier getoonde methoden zullen werken voor vele andere soorten aangepaste velden, en de logica voor het maken en weergeven van velden blijft hetzelfde.
Veldgroepen zijn precies wat ze zeggen: groepen velden. Met behulp van het voorbeeld van het hebben van een berichttype genaamd film
, we willen misschien de volgende gegevens opnemen:
Deze velden behoren logisch tot een groep, omdat ze allemaal gerelateerd zijn aan hetzelfde berichttype. Met behulp van bovenstaande velden kunnen we beginnen na te denken over welke veldtypen we mogelijk nodig hebben voor deze gegevens.
Als u wilt beginnen met het toevoegen van een veldgroep, klikt u op Aangepaste velden menu in uw WordPress-dashboard. Klik nu op de Voeg nieuw toe knop. Je krijgt nu de Nieuwe veldgroep toevoegen scherm. Voordat we iets anders doen, laten we onze veldgroep een naam geven door het titelvak in te typen - ik heb de mijne genoemd Filmgegevens
.
Vervolgens kunnen we al onze velden toevoegen. Klik op de Voeg veld toe knop om te beginnen. U ziet nu een formulier met de volgende velden:
Filmjaar
, Filmregisseur
, enz.Filmjaar
zoals een veldlabel zou veranderen movie_year
als een veldnaam.jaar
invoer moeten we de tekens beperken tot vier.Deze velden verschijnen allemaal voor de tekst
veldtype-op sommige andere veldtypen sommige van deze opties worden mogelijk niet weergegeven of er kunnen enkele extra opties zijn. Omdat we ook de. Zullen gebruiken aantal
veldtype, er zijn enkele extra opties beschikbaar voor ons:
Dit is hoe ik mijn velden heb ingesteld:
Let op de minimum- en maximumwaarden hier: ik heb deze ingesteld om een aantal zeer eenvoudige validaties toe te voegen, omdat het onwaarschijnlijk is dat we een film ouder dan 1900 en een nieuwer dan 2050 in de levensduur van de website zullen hebben.
Omdat we onze output in onze HTML zullen opmaken, willen we niet dat redacteurs hier HTML kunnen toevoegen die onze lay-out kan verstoren. Daarom is hier "geen formattering" gekozen.
Nogmaals, we hebben hier een minimum- en een maximumwaarde ingesteld om enige validatie toe te voegen; onze scores zijn op tien, dus we willen niet dat redacteuren een hogere score kunnen invoegen. Evenzo willen we niet dat er scores worden ingevoegd die lager zijn dan één.
Ik heb een aantal veldinstructies toegevoegd aan deze ingang, omdat er geen is URL
veldtype, dus het is moeilijk te valideren. De instructies moeten het voor redacteuren gemakkelijker maken om te begrijpen hoe het veld moet worden gebruikt.
Nadat u al uw velden hebt toegevoegd, klikt u op de Bijwerken knop. Zodra je erop hebt geklikt kom je terug op de Veldgroep bewerken pagina. Er zijn nog een paar dingen die we op dit scherm moeten doen om ervoor te zorgen dat uw velden correct werken.
Onder het veldgebied wordt een vak genoemd Plaats-Hiermee kunnen we bepalen waar onze aangepaste velden worden weergegeven. We willen alleen onze aangepaste velden laten zien als het berichttype is film
. Selecteer in de eerste vervolgkeuzelijst Berichttype, in de tweede keuzelijst selecteren is gelijk aan, en in de derde selecteren film.
Het laatste wat we hier moeten doen is instellen waar ons aangepaste veld op het bewerkingsscherm verschijnt. Blader hiervoor iets verder naar beneden opties sectie. Dit stelt ons in staat te kiezen waar de metabox voor het aangepaste veld zal verschijnen en welk type het is, en het geeft ons de mogelijkheid om andere dingen te verbergen in ons bewerkingsscherm.
De opties zijn als volgt:
De opties die ik heb gebruikt zijn:
De rest bleef achter als hun standaardwaarden.
U kunt controleren of uw velden correct worden weergegeven door een nieuw bericht te plaatsen (in dit geval in de film
berichttype). Als alles goed is verlopen, zie je je metabox. Dit is een goed moment om wat testgegevens toe te voegen.
Nu u uw veldgroepen hebt gemaakt en wat testgegevens hebt, kunt u beginnen met het weergeven van de gegevens binnen uw thema of kindthema.
U kunt de standaard WordPress gebruiken get_post_meta ()
functie met ACF, maar het wordt aanbevolen dat u de eigen functies van ACF gebruikt, omdat ACF de waarden opmaakt, afhankelijk van het veldtype dat u hebt gemaakt. We gaan ACF's gebruiken het veld()
functie. Deze functie geeft uw aangepaste veld weer en neemt een parameter van de veldnaam, bijvoorbeeld:
Laten we onze metagegevens aanpakken. We zullen al deze informatie in een single hebben div
.
- :
- :
- : / 10
- "target =" _ blank ">
Deze code is vrij eenvoudig - we gebruiken de _e
functie om onze strings te internationaliseren en te echoën, en vervolgens de ACF te gebruiken het veld()
methode om de waarde van het veld dat we hebben gemaakt te herhalen. Dit alles is op een ongeordende lijst geplaatst, in een div
element met een klasse van reviews-meta
, zodat we het kunnen richten met onze CSS.
Waar gaat deze code naartoe? In dit geval is het het beste om een nieuwe sjabloon voor uw berichttype te maken. Maak hiertoe een kopie van uw thema's single.php
bestand en noem het single-postname.php
-in ons geval single-movie.php
. elk single.php
ziet er anders uit, maar ze moeten allemaal één ding gemeen hebben: een WordPress-lus. Uw WordPress-lus zou er ongeveer zo uit moeten zien:
Uw aangepaste velden kunnen buiten de lus vallen en precies waar u ze plaatst, is afhankelijk van hoe u de pagina eruit wilt laten zien. In mijn geval (met het standaard Twenty Fourteen-thema) heb ik ze net onder de lus geplaatst en wat basisstyling toegepast op de .reviews-meta
CSS-klasse.
We hebben de basisbeginselen van de plug-in Advanced Custom Fields besproken. Dat wil zeggen dat we enkele velden hebben toegevoegd en deze nu op onze site weergeven. Maar er is nog veel meer bij ACF en we hebben net de oppervlakte ingekrast. Er zijn veel meer veldtypen die u kunt gebruiken, evenals geavanceerdere functies zoals voorwaardelijke logica.
Aarzel niet om vragen, opmerkingen en algemene feedback achter te laten in het onderstaande formulier!