{"id":37272,"date":"2020-09-10T23:44:53","date_gmt":"2020-09-11T06:44:53","guid":{"rendered":"https:\/\/kinsta.com\/?p=72202"},"modified":"2023-09-21T09:23:04","modified_gmt":"2023-09-21T09:23:04","slug":"wordpresskrokar","status":"publish","type":"post","link":"https:\/\/kinsta.com\/se\/blog\/wordpresskrokar\/","title":{"rendered":"Bootcamp f\u00f6r WordPresskrokar: S\u00e5 anv\u00e4nder du \u00e5tg\u00e4rds-, filter- och anpassade krokar"},"content":{"rendered":"

WordPresskrokar \u00e4r ett av de viktigaste verktygen att ha i en WordPress-utvecklares arsenal<\/a>. De \u00e4r grunden f\u00f6r plugin- och temautveckling inom WordPress. Du kan anv\u00e4nda WordPress m\u00e5nga inbyggda krokar f\u00f6r att ”kroka p\u00e5” WordPressk\u00e4rnan med din anpassade kod f\u00f6r att g\u00f6ra<\/strong> eller \u00e4ndra<\/strong> n\u00e5got.<\/p>\n

Det finns tv\u00e5 typer av WordPresskrokar: Action<\/strong> (\u00e5tg\u00e4rder) och Filter<\/strong>. Krokar \u00e4r s\u00e5 vanliga att WordPressk\u00e4rnan ocks\u00e5 anv\u00e4nder dem i stor utstr\u00e4ckning. WordPress inneh\u00e5ller ocks\u00e5 ett s\u00e4tt f\u00f6r dig att definiera dina egna anpassade krokar<\/strong> s\u00e5 att andra utvecklare kan kroka p\u00e5 din kod.<\/p>\n

Att l\u00e4ra sig hur \u00e5tg\u00e4rds-, filter- och anpassade krokar fungerar \u00e4r viktigt f\u00f6r att beh\u00e4rska WordPress-utveckling.<\/p>\n

Den f\u00f6rsta halvan av denna artikel t\u00e4cker grunderna om WordPresskrokar och f\u00f6rklarar hur de fungerar med flera exempel. Under andra halvan l\u00e4r du dig hur du kan anv\u00e4nda krokar f\u00f6r att anpassa WordPress, skapa egna krokar och anv\u00e4nda dem f\u00f6r att bygga dina egna f\u00f6rl\u00e4ngningsbara plugins.<\/p>\n

L\u00e5ter det sp\u00e4nnande? Nu b\u00f6rjar vi!<\/p>\n

<\/div><\/kinsta-auto-toc>\n

Vad \u00e4r WordPresskrokar?<\/h2>\n

En WordPress-sida<\/a> s\u00e4tts samman av massor av funktioner och databasf\u00f6rfr\u00e5gningar. WordPressk\u00e4rnan, plugins och teman samarbetar f\u00f6r att mata ut sidelement som text, bilder<\/a>, skript och stilar. N\u00e4r allt \u00e4r klart s\u00e4tter webbl\u00e4saren ihop dem och renderar sidan.<\/p>\n

WordPresskrokar l\u00e5ter dig ”kroka p\u00e5” denna byggprocess vid vissa punkter och k\u00f6ra din egen kod. Huvudfunktionen hos krokar \u00e4r att du kan \u00e4ndra eller l\u00e4gga till funktioner till WordPress utan att r\u00f6ra k\u00e4rnfilerna<\/a>.<\/p>\n

\"Krokar
Krokar hj\u00e4lper dig att ut\u00f6ka WordPress med din egen kod<\/figcaption><\/figure>\n

WordPress Plugin API<\/a> driver funktionaliteten hos WordPresskrokarna. Du anv\u00e4nder krokar genom att anropa vissa WordPressfunktioner som kallas Krokfunktioner<\/strong> vid specifika instanser d\u00e5 WordPress k\u00f6rs.<\/p>\n

Med hj\u00e4lp av krokfunktioner kan du bunta din anpassade kod inom en Callback-funktion<\/strong> och registrera den med vilken krok som helst. N\u00e4r den \u00e4r registrerad kommer denna callback att k\u00f6ras varhelst kroken \u00e4r, s\u00e5 att du kan ut\u00f6ka eller ers\u00e4tta de vanliga WordPress-funktionerna.<\/p>\n

Krokens position i kodk\u00f6rningsprocessen \u00e4r en viktig faktor. Du l\u00e4r dig mer om dess betydelse i de kommande avsnitten.<\/p>\n\n

Tv\u00e5 typer av WordPresskrokar: \u00e5tg\u00e4rder\/actions och filter<\/h3>\n

WordPress inneh\u00e5ller tv\u00e5 typer av krokar som kallas Actions<\/strong> (\u00e5tg\u00e4rder) och Filter<\/strong>. \u00c5tg\u00e4rder l\u00e5ter dig g\u00f6ra<\/strong> n\u00e5got p\u00e5 vissa f\u00f6rdefinierade punkter d\u00e5 WordPress k\u00f6r, medan filter l\u00e5ter dig \u00e4ndra<\/strong> data som behandlas av WordPress och return<\/code> dem.<\/p>\n

\u00c5tg\u00e4rder\/actions definieras i WordPress-koden som:<\/p>\n

do_action( 'action_name', [optional_arguments] );<\/code><\/pre>\n
Action_name<\/code><\/strong>-str\u00e4ngen \u00e4r namnet p\u00e5 \u00e5tg\u00e4rden. Du kan ange variabeln [optional_arguments]<\/code><\/strong> f\u00f6r att skicka ytterligare argument till callback-funktionen. Om det h\u00e4r f\u00e4ltet inte anges kommer standardv\u00e4rdet att vara tomt.<\/p>\n
Exempel:<\/strong> \u00e5tg\u00e4rden do_action ('wp_head')<\/code><\/strong> kan krokas p\u00e5 f\u00f6r att k\u00f6ra anpassad kod varje g\u00e5ng WordPress behandlar webbplatsens header<\/a>. Denna \u00e5tg\u00e4rd har inga andra argument.<\/p>\n
Filter definieras i WordPress-koden som:<\/p>\n
apply_filters( 'filter_name', 'value_to_be_filtered', [optional_arguments] );<\/code><\/pre>\n
Str\u00e4ngen filter_name<\/code><\/strong> \u00e4r namnet p\u00e5 filtret, value_to_be_filtered<\/code>–<\/strong>variabeln \u00e4r det v\u00e4rde som m\u00e5ste filtreras och returneras, och variabeln [optional_arguments]<\/code><\/strong> kan skicka ytterligare argument, precis som med \u00e5tg\u00e4rder.<\/p>\n
Exempel:<\/strong> filtret apply_filters ('admin_footer_text', string $text )<\/code><\/strong> kan krokas p\u00e5 f\u00f6r att \u00e4ndra texten som visas i admin-headern. Fr\u00e5n och med WordPress 5.4 kommer dess standardv\u00e4rde att visa meningen Tack f\u00f6r att du skapar med<\/em> WordPress<\/em><\/a>.<\/em> i adminomr\u00e5dets footer.<\/p>\n
Du l\u00e4r dig att kroka p\u00e5 \u00e5tg\u00e4rder och filter senare med m\u00e5nga exempel fr\u00e5n WordPressk\u00e4rnan.<\/p>\n
N\u00e4r allt \u00e4r p\u00e5krokat kan du styra din kod f\u00f6r att g\u00f6ra<\/strong> eller anpassa<\/strong> n\u00e5got p\u00e5 din webbplats. Du kan till exempel anv\u00e4nda krokar f\u00f6r att skicka ett automatiserat e-postmeddelande<\/a> efter att ha publicerat ett inl\u00e4gg, eller ladda anpassade stilmallar<\/a> f\u00f6r att \u00e4ndra utseendet p\u00e5 din webbplats.<\/p>\n
\"WordPresskrokar
WordPresskrokar hj\u00e4lper dig att interagera med eller \u00e4ndra din webbplats<\/figcaption><\/figure>\n
Det enklaste s\u00e4ttet att f\u00f6rst\u00e5 krokar \u00e4r att f\u00f6rest\u00e4lla dig din WordPresswebbplats<\/a> som att bygga ett hus.<\/p>\n
Krokar \u00e4r som att anv\u00e4nda en kran f\u00f6r att flytta byggmaterial fram och tillbaka. Objekten som flyttas \u00e4r Callback-funktioner<\/strong> som inneh\u00e5ller din anpassade kod<\/a>. Dessa objekt (eller funktioner) kan hj\u00e4lpa dig att bygga eller \u00e4ndra huset.<\/p>\n
\"Exempel
Exempel p\u00e5 att kroka p\u00e5 ”wp_head”-\u00e5tg\u00e4rden i WordPress<\/figcaption><\/figure>\n
Callback-funktioner kan vara vanliga PHP-funktioner, WordPress standardfunktioner eller anpassade funktioner som definieras av dig.<\/p>\n
Vi kan bara b\u00e4ra vissa objekt p\u00e5 specifika b\u00e4rare kopplade till s\u00e4rskilda krokar. \u00c5tg\u00e4rder kan d\u00e4rf\u00f6r endast krokas p\u00e5 \u00c5tg\u00e4rdsfunktioner<\/strong>.\u00a0P\u00e5 samma s\u00e4tt kan Filter endast krokas p\u00e5 Filterfunktioner<\/strong>.<\/p>\n
\u00c4ven om det \u00e4r tr\u00e5kigt att byta krokar och b\u00e4rare p\u00e5 en kran, g\u00f6r WordPress det superenkelt genom att inkludera \u00f6ver 2 200 typer av standardkrokar<\/a>.<\/p>\n
\"WordPress
WordPress 5.1 har 2200+ inbyggda krokar (k\u00e4lla: Adam Brown)<\/figcaption><\/figure>\n
Du kan hitta krokar utspridda \u00f6ver hela WordPressk\u00e4rnan, s\u00e5 att du kan utnyttja den exakta position d\u00e4r du vill kroka p\u00e5 och k\u00f6ra din anpassade kod.<\/p>\n\n
Krokar vs \u00e5tg\u00e4rder vs filter<\/h2>\n
Enligt WordPress Pluginhandbok<\/a>:<\/p>\n
”Krokar \u00e4r ett s\u00e4tt f\u00f6r en bit kod att interagera\/\u00e4ndra en annan bit kod… det finns tv\u00e5 typer av krokar: \u00c5tg\u00e4rder och Filter.<\/em>”<\/p><\/blockquote>\n
Det finns utbredd inkonsekvens f\u00f6r hur termerna Krok<\/strong>, \u00c5tg\u00e4rd<\/strong> och Filter<\/strong> anv\u00e4nds. N\u00e5gra handledningar och guider blandar ihop dem med de funktioner som \u00e4r f\u00f6rknippade med dem. En viktig orsak till denna f\u00f6rvirring \u00e4r den komplexa karakt\u00e4ren av hur krokar fungerar.<\/p>\n
\u00c4ven n\u00e4r du tittar noggrant i WordPressk\u00e4rnan finner du att det inte finns s\u00e5 stor skillnad mellan att l\u00e4gga till \u00e5tg\u00e4rder och filter. H\u00e4r \u00e4r k\u00e4llkoden f\u00f6r add_action()-funktionen<\/a> fr\u00e5n wp-includes\/plugin.php<\/code><\/strong>-filen:<\/p>\n
:<\/span><\/p>\n
function add_action( $tag, $function_to_add, $priority = 10, $accepted_args = 1 ) {\u00a0 \u00a0 \u00a0 \n    return add_filter( $tag, $function_to_add, $priority, $accepted_args );\n}<\/code><\/pre>\n
Add_action()<\/code><\/strong>-funktionen anropar bara add_filter()<\/code><\/strong>-funktionen och returnerar dess v\u00e4rde. Varf\u00f6r? Eftersom de b\u00e5da i grunden fungerar likadant, f\u00f6rutom en skillnad.<\/p>\n
Funktionen apply_filters()<\/code><\/strong> returnerar ett v\u00e4rde som kan \u00e4ndra befintliga datatyper, medan funktionen do_action()<\/code><\/strong> returnerar ingenting (NULL-v\u00e4rde i PHP<\/a>).<\/p>\n
Om du fortfarande \u00e4r f\u00f6rvirrad, oroa dig inte! N\u00e4r du kommit igenom den f\u00f6rsta halvan av den h\u00e4r artikeln kommer allt att vara klart och tydligt. Vi h\u00e5ller oss till den officiella WordPress Codex-terminologin eftersom den \u00e4r tydlig, exakt och universell.<\/p>\n
Nu kan du bekanta dig med Krokrutinen enligt hur vi visar den nedan.<\/p>\n
\"Krokrutinen:
Krokrutinen: Krokar, Krokfunktioner och Callbackfunktioner<\/figcaption><\/figure>\n
L\u00e5t oss g\u00e5 igenom skillnaderna mellan \u00e5tg\u00e4rder och krokar.<\/p>\n\n\n\n\n\n\n\n\n\n\n\n\n\n
WordPress-krokar<\/strong><\/td>\n<\/tr>\n
\u00c5tg\u00e4rder<\/strong><\/td>\nFilters<\/strong><\/td>\n<\/tr>\n
\u00c5tg\u00e4rder anv\u00e4nds f\u00f6r att k\u00f6ra anpassade funktioner vid en viss punkt under exekveringen av WordPressk\u00e4rnan.<\/td>\nFilter anv\u00e4nds f\u00f6r att \u00e4ndra eller anpassa data som anv\u00e4nds av andra funktioner.<\/td>\n<\/tr>\n
\u00c5tg\u00e4rder definieras\/skapas av funktionen do_action ('action_name')<\/strong><\/code> i WordPress-koden.<\/td>\nFilter definieras\/skapas av funktionen apply_filters ('filter_name', 'value_to_be_filtered')<\/strong><\/code> i WordPress-koden.<\/td>\n<\/tr>\n
\u00c5tg\u00e4rder kallas ocks\u00e5 \u00c5tg\u00e4rdskrokar<\/strong>.<\/td>\nFilter kallas ocks\u00e5 Filterkrokar<\/strong>.<\/td>\n<\/tr>\n
\u00c5tg\u00e4rder kan endast krokas p\u00e5 \u00c5tg\u00e4rdsfunktioner. T.ex. add_action()<\/strong>, remove_action()<\/code><\/strong>.<\/td>\nFilter kan endast krokas p\u00e5 filterfunktioner. T. ex. add_filter()<\/strong><\/code>, remove_filter()<\/strong><\/code>.<\/td>\n<\/tr>\n
\u00c5tg\u00e4rdsfunktioner beh\u00f6ver inte skicka n\u00e5gra argument till sina callbackfunktioner.<\/td>\nFilterfunktioner m\u00e5ste skicka minst ett argument till sina callbackfunktioner.<\/td>\n<\/tr>\n
\u00c5tg\u00e4rdsfunktioner kan utf\u00f6ra alla m\u00f6jliga uppgifter, inklusive att \u00e4ndra hur WordPress fungerar.<\/td>\nFilterfunktioner finns bara f\u00f6r att \u00e4ndra de data som \u00f6verf\u00f6rs till dem av filtren.<\/td>\n<\/tr>\n
\u00c5tg\u00e4rdsfunktioner b\u00f6r inte return<\/code><\/strong>n\u00e5gonting. De kan dock echo<\/code><\/strong>resultatet eller interagera med databasen.<\/td>\nFilter functions must return<\/strong><\/code> their changes as output. Even if a filter function changes nothing, it must still return<\/strong><\/code> the unmodified input.<\/td>\n<\/tr>\n
\u00c5tg\u00e4rder kan exekvera n\u00e4stan vad som helst, s\u00e5 l\u00e4nge koden \u00e4r giltig.<\/td>\nFilter b\u00f6r fungera p\u00e5 ett isolerat s\u00e4tt, s\u00e5 att de inte f\u00e5r n\u00e5gra oavsiktliga biverkningar.<\/td>\n<\/tr>\n
Sammanfattning:<\/strong> en \u00e5tg\u00e4rd avbryter den vanliga kodexekveringsprocessen f\u00f6r att g\u00f6ra n\u00e5got med den information den tar emot, men returnerar ingenting tillbaka.<\/td>\nSammanfattning:<\/strong> ett filter \u00e4ndrar informationen den tar emot, returnerar den tillbaka till den anropande krok-funktionen och andra funktioner kan anv\u00e4nda det v\u00e4rde den returnerar.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
\u00a0<\/p>\n
Ibland kan du anv\u00e4nda antingen en \u00e5tg\u00e4rd eller ett filter f\u00f6r att uppn\u00e5 samma m\u00e5l. Om du till exempel vill \u00e4ndra texten i ett inl\u00e4gg kan du registrera en callback-funktion med publish_post<\/a>-\u00e5tg\u00e4rden och \u00e4ndra inl\u00e4ggsinneh\u00e5llet n\u00e4r det sparas i databasen<\/a>.<\/p>\n
\/\/ define the callback function to change the text\nfunction change_text_callback() { \n    \/\/ add the code to change text here\n}\n\n\/\/ hook in to the 'publish_post' action with the add_action() function\nadd_action( 'publish_post', 'change_text_callback' );<\/code><\/pre>\n
Eller s\u00e5 kan du registrera en annan callback-funktion med the_content<\/a>-filtret f\u00f6r att \u00e4ndra inl\u00e4ggsinneh\u00e5llet innan det visas i webbl\u00e4saren.<\/p>\n
\/\/ define the callback function to modify the text\nfunction change_text_another_callback( $content ) { \n    \/\/ add the code to change text here and then return it \n    return $filtered_content;\n}\n\n\/\/ hook in to 'the_content' filter with the add_filter() function\nadd_filter( 'the_content', 'change_text_another_callback');<\/code><\/pre>\n
Tv\u00e5 olika tillv\u00e4gag\u00e5ngss\u00e4tt med samma resultat. Att veta n\u00e4r man ska anv\u00e4nda den ena eller den andra \u00e4r nyckeln till att vara en bra WordPressutvecklare<\/a>.<\/p>\n
Hur fungerar WordPresskrokar?<\/h2>\n
Husexemplet var enkelt nog f\u00f6r att f\u00f6rst\u00e5 krokarnas grundl\u00e4ggande funktion, men det beskriver inte komplexiteten i hur de fungerar. Och s\u00e4rskilt inte begreppen krok-position och specificitet.<\/p>\n
Ett b\u00e4ttre exempel skulle vara att f\u00f6rest\u00e4lla sig bearbetningen av en WordPresswebbsida som monteringen av en bil. Till skillnad fr\u00e5n tillverkning av en bil, som tar tid, \u00e4r montering av en webbsida n\u00e4stan \u00f6gonblicklig.<\/p>\n
\"Att
Att montera en webbsida \u00e4r som att montera en bil<\/figcaption><\/figure>\n
Ungef\u00e4r som hur en bil s\u00e4tts ihop del f\u00f6r del i en modern monteringslinje, monteras en WordPresswebbsida element f\u00f6r element av servern och klienten.<\/p>\n
WordPressk\u00e4rnan \u00e4r som bilmotorn, chassit och andra v\u00e4sentligheter, som driver webbplatsens grundl\u00e4ggande funktionalitet.<\/p>\n
Du kan ha en funktionell hemsida med bara WordPressk\u00e4rnan, men hur kul \u00e4r det? Du m\u00e5ste l\u00e4gga till sp\u00e4nnande funktioner p\u00e5 webbplatsen. Det \u00e4r d\u00e4r WordPress-plugins<\/a> och teman<\/a> kommer in, som b\u00e5da anv\u00e4nder krokar i stor utstr\u00e4ckning.<\/p>\n
I exemplet ovan \u00e4r varje numrerad station som en krok inuti WordPressk\u00e4rnan. Det finns tv\u00e5 typer av stationer, precis som \u00e5tg\u00e4rder och filter. Varje station inneh\u00e5ller en specifik typ av plats som endast accepterar vissa verktyg, liknande \u00e5tg\u00e4rdsfunktioner och filterfunktioner.<\/p>\n
Alla stationer \u00e4r placerade med t\u00e4ta intervall f\u00f6r modularitet och effektivitet.<\/p>\n
Beroende p\u00e5 en viss positions krav kan vi f\u00e4sta (eller kroka p\u00e5 det l\u00e4mpligaste verktyget f\u00f6r den specifika stationens jobb. Dessa verktyg \u00e4r som callback-funktionerna som vi anv\u00e4nde f\u00f6r att interagera med eller \u00e4ndra WordPress.<\/p>\n
Vissa verktyg kan v\u00e4sentligt f\u00f6r\u00e4ndra bilens funktion, ungef\u00e4r som callbacks till \u00e5tg\u00e4rder. Andra verktyg anv\u00e4nds endast f\u00f6r att anpassa utseendet p\u00e5 bilen, som callbacks till filter.<\/p>\n
Att anv\u00e4nda r\u00e4tt verktyg p\u00e5 r\u00e4tt stationer \u00e4r avg\u00f6rande f\u00f6r att bygga en f\u00f6rstklassig bil. P\u00e5 samma s\u00e4tt hj\u00e4lper krokar oss att anpassa WordPress enligt v\u00e5ra unika behov.<\/p>\n
Om du ut\u00f6kar denna analogi \u00e4r plugins som att l\u00e4gga till anv\u00e4ndbara bilfunktioner som krockkuddar, underh\u00e5llningskonsoller, nyckelfritt fj\u00e4rrsystem, etc. (som dessa f\u00f6r att f\u00f6rb\u00e4ttra WooCommerce-funktionaliteten<\/a>). Teman \u00e4r analoga med att anpassa den visuella delen av bilen, som den \u00f6vergripande designen, lackering, f\u00e4lgar etc. (det \u00e4r s\u00e5 h\u00e4r du anpassar ditt WordPresstema<\/a>).<\/p>\n
Var ska krokar och deras funktioner registreras?<\/h2>\n
Det finns tv\u00e5 rekommenderade s\u00e4tt att l\u00e4gga till krokar i WordPress:<\/p>\n