Vad är Advanced Custom Fields (ACF) i WordPress och vad ska jag med dem till?

Michael Hörnlimann Senast uppdaterad den 21 oktober 2020
6 Min.
advanced custom fields Wordpress
Senast uppdaterad den 21 oktober 2020

"Du vet Advanced Custom Fields Inte? Utan ACF skulle jag WordPress definitivt inte längre använda." Detta gjordes av en kollega till mig för några veckor sedan via Slack Skrivet. Men han är en utvecklare, jag är designer. Vid den tiden senast, dock insåg jag att jag borde (och ville) ta itu med det.

Vad är Advanced Custom Fields ?

WordPress i sig redan erbjuder ett brett spektrum av funktioner. Med den Advanced Custom Fields du kan förlänga dessa funktioner igen - i standardversionen gratis. De tillåter dig att ha full kontroll över innehållet på din webbplats.

Som standard hittar vi typiska fält som titel, innehåll, datum och författare i backend för inlägg och sidor. Advanced Custom Fields , eller den som nämns nedan Plugin , ge dig möjlighet att WordPress och därmed utöka sidor och bidrag praktiskt efter be vilja och individuellt.

Det innebär att med WordPress så mycket som något möjligt - Advanced Custom Fields som en stämning för WordPress .

Vad behöver jag Advanced Custom Fields Någonsin?

i ett nötskal: Du behöver Advanced Custom Fields förmodligen om du använder de inbyggda elementen i WordPress -Backend kan inte längre framskridas. Du står inför en utmaning som inte kan förverkligas med hjälp av sidor eller bidrag, eller bara delvis.

Detta kan vara fallet relativt snabbt, beroende på kundens önskemål. Om du är en webbdesigner själv, kommer detta säkert också att vara bekant för dig.

Till exempel fick jag bygga en sökning med filterkriterier. Så inte en enkel textsökning, som söker efter lämpligt innehåll över hela hemsidan, men en sökning där specifika uppgifter kan skrivas in först via formulär. Användaren har olika filterkriterier tillgängliga. Dessa inkluderar:

  • Namn (textruta)
  • Postkod (Textfält)
  • Land (Dropdown)
  • Certifikat (Kryssruta)

Men mer om det senare. Detta användningsfall gav mig idén om Advanced Custom Fields (ACF). En sådan individuell sökning är WordPress -Ombord element helt enkelt inte möjligt utan ACF.

Advanced Custom Fields : Den fria Plugin

Så jag letade efter en lösning för att hitta detta filter med hjälp av Advanced Custom Fields Genomföra.

Den självbetitlade Plugin i den officiella WordPress - Plugin katalog är från Elliot Condon. Den australiska arbetar mycket aktivt på det och ständigt utveckla det, så att nya funktioner fortsätter att visas. Om du vill vara mycket nära åtgärden kan du följa ACF på Twitter.

Om du redan har varit modig och fullt ut WordPress 5.0 introducerade blockredigeraren ( Gutenberg ) finns även i Advanced Custom Fields Block för den nya redigeraren.

Den ACF Plugin är för närvarande verksam på långt över 1 miljon webbplatser. Den testas mycket intensivt och fungerar med den senaste WordPress versionen oklanderlig. Det är också imponerande att den Plugin har redan fått mer än 1000 5-stjärniga recensioner. Å andra sidan finns det en measly 16 betyg med endast en stjärna - troligen användare som har gett upp efter (mycket) en kort tid.

När det gäller en sådan Plugin det är klart att det tar lite tid och tålamod för dig att förstå ansökan. Naturligtvis fick jag också bara upp till ytan av Advanced Custom Fields Repad. Jag vill helt enkelt säga att det finns andra Plugins du installerar och sedan de fungerar bekvämt i bakgrunden - det är annorlunda med ACF. Du måste aktivt utforma och känna igen det övergripande förhållandet mellan databas, backend och frontend.

Hur är det med detta Plugin , som är ganska tekniskt, är också oumbärligt: stödet.

Jag har inte behövt göra anspråk på det här själv än. Anledningen är mycket enkel: den förstklassiga dokumentationen,som handlar om fälttyper, funktioner, filter och FAQ.

Vad är Anpassade inläggstyper?

Jag nämnde tidigare att aktiv design är nödvändig. Det innebär Advanced Custom Fields också att i vissa fall dessa ensam inte ger dig mycket nytta. Endast i kombination med Anpassade Inläggstyper uppstår ytterligare alternativ.

Först uppstår frågan: Vad är en (normal) posttyp?

De två mest kända i WordPress är sidor och inlägg (blogginlägg). Så för varje nytt innehåll du vill skapa för en webbplats, bestämmer du vilken inläggstyp som är den rätta. Detta beror på flera faktorer, bland annat hur informationen ska vara synlig och vilka fält du behöver i backend.

Men vad händer om du vill tillhandahålla innehåll som inte kan täckas av en normal sida eller ett inlägg?

Du kanske redan vet: Du behöver ett nytt sätt att införliva innehållet i backend. Nästan en indatamask med exakt de fält du behöver. Detta är vad den Advanced Custom Fields Erbjuder. De ovan nämnda självbetitlade Plugin låter dig definiera och skapa dessa fält bekvämt i backend. När denna struktur är på plats, är nästa steg att göra det.

advanced custom fields egna fält
I bakend av ACF Plugins du enkelt kan definiera fält.

Sedan används Anpassade inläggstyper. Det är här mycket viktigt att det är meningsfullt att använda Advanced Custom Fields skapa en egen Anpassad posttyp. I mitt fall kallar jag Custom Post Type (CPT) bara terapeuter.

Naturligtvis kan du också programmera den Anpassade Post Typ själv. Jag har dock den Plugin "Custom Post Type UI", som jag kommer att förklara mer i detalj i nästa avsnitt.

skapa anpassad posttyp
Så här är backend av de Plugins "Anpassad Post Typ UI".

Anpassad Post Typ UI: Gratis Plugin , den andra

Om detta hittills bara har gjorts för dig med den Advanced Custom Fields (ACF) var för lite magi, kommer hit det bästa: ACF i kombination med Custom Post Type UI, eller CPT UI för kort.

På så sätt kan du visa databasinnehåll direkt i frontend om så önskas. I mitt fall stod jag inför utmaningen att bygga en filtersökning med olika fält. Så jag var tvungen att ladda upp alla data till backend med hjälp av en CSV import först.

Efteråt, med hjälp av Den anpassade Post Typ samt den Advanced Custom Fields grunden för filtersökning i frontänden. Mer om detta i nästa avsnitt.

acf-kombination för anpassad inläggstyp
Så här kan din nya anpassade inläggstyp till exempel se ut.

Praktiskt exempel: Byggsökning med filterkriterier

Så mycket för tillfället till backend. Nu ska den till fronten. Så att du kan tillämpa det hela och Advanced Custom Fields för ditt fall.

Jag använde ACF för att bygga en individuell sökning med filterkriterier. Men hur är det möjligt att presentera innehållet från backend elegant i fronten, så att interaktion av användaren är möjligt?

Återigen har du valet mellan att utveckla dig själv och Plugin . Återigen sökte jag efter en bra hjälpare under en lång tid och kom till över Sök & Filter Pro (är länkad i slutet av texten).

Detta ger mig möjlighet att använda data i backend för visning i fronten slutet på ett genialt sätt. I mitt exempel är dessa:

  • Sök (normal sökruta)
  • Bokför Meta (åtkomst och sök efter respektive Avancerat anpassat fält i databasen)
  • Skicka-knapp (knapp för att skicka sökfrågan eller formuläret)

I baken kan detta se ut så här:

sök och filtrera pro-backend
Med den Plugin "Sök & Filter Pro" kan du skapa en individuell sökning med filtervillkor.

Du kan sedan använda kortkod för att infoga den filtersökning du just skapade var som helst i backend (till exempel på en sida).

Du kommer dock att se att det kommer att se lite fult ut. Jag har förbättrat detta med några CSS handtag och tycker att resultatet i fronten är ganska imponerande:

praktiskt exempel acf

Kompletterande länkar

Jag är nyfiken på att se vad jag kan göra med Advanced Custom Fields kan genomföras. Har du några frågor eller kommentarer om den här artikeln? Då är jag glad att få mycket feedback.

Foto: Shane Aldendorff | Unsplash

Michael Hörnlimann , född 1991 i Zürich, älskar naturen samt god mat. Sedan april 2018 har han uteslutande arbetat självständigt och skapat WordPress webbplatser för kundens räkning. Sedan dess har han kombinerat arbete med sin stora passion, reser till främmande länder och kulturer. Han bor och arbetar oberoende av platsen, ibland i bergen, ibland vid havet.

Kommentarer om den här artikeln

Skriva en kommentar

Din e-postadress kommer inte att publiceras. Obligatoriska fält är markerade med *.