Använda WordPress Meta Boxes för att bygga en grundläggande SEO-plugin

En av kärnfunktionerna som tillhandahålls av WordPress för att utöka sin funktionalitet är dess Meta Box API. Med dessa metakassor kan du enkelt lägga till ytterligare data till ditt innehåll. Till exempel, Inläggstaggar Meta Box gör att du kan ange taggar för ditt inlägg.

I den här artikeln kommer vi att bygga ett grundläggande SEO-plugin som lägger till en metabeskrivning och en öppen grafitel och beskrivningstagg till huvud del av WordPress-sidor. På så sätt lär vi oss också hur man skapar anpassade metakasser, hur man sanerar användarinformation, hur man sparar data till ett inlägg eller en sida och hur man hämtar och sparar sparade data.

Eftersom jag inte kommer att förklara varje bit av vad koderna använder i denna handledning, antas en grundläggande kunskap om metakasser och vad PHP-funktionerna gör. Om du inte är bekant med grunderna, då en bra start i hur man skapar anpassade WordPress Write / Meta Boxes.

Skapa Meta Box

Först måste vi bestämma varav meta-rutan ska visas. 

I vårt plugin läggs metaboxen i posta och sida skärm. För att uppnå detta skapas en funktion som innehåller en variabel som lagrar en matris över var för att visa metakassen och a för varje loop som loopar genom matrisen och lägger meta boxen till den angivna skärmen med add_meta_box fungera. 

Slutligen är funktionen ansluten till add_meta_boxes verkan.

funktionen tes_mb_create () / ** * @array $ skärmar Skriv skärm som visar meta boxen * @values ​​post, sida, instrumentpanel, länk, bilaga, custom_post_type * / $ screens = array ("post", "page" ); foreach ($ skärmar som $ skärm) add_meta_box ('tes-meta', 'Search Engine Listing', 'tes_mb_function', $ screen, 'normal', 'high');  add_action ('add_meta_boxes', 'tes_mb_create');

Alternativt kan du lägga till en dubbel add_meta_box funktion för att inkludera metakassen på både post- och sidskärmen som så:

funktion tes_mb_create () add_meta_box ('tes-meta', 'Search Engine Listing', 'tes_mb_function', 'post', 'normal', 'high'); add_meta_box ('tes-meta', 'Search Engine Listing', 'tes_mb_function', 'page', 'normal', 'high');  add_action ('add_meta_boxes', 'tes_mb_create');

Kodning av Meta Box Fields

Från koden ovan kallas återuppringningsfunktionen för att skriva ut HTML-skriptet för redigeringsskärmens avsnitt som tes_mb_function vilket är det tredje argumentet som passerat till add_meta_box fungera.

I vårt plugin kodar vi bara två HTML-formulärfält för att hantera titel- och beskrivningsdata.

funktion tes_mb_function ($ post) / / hämta metadata värdena om de existerar $ tes_meta_title = get_post_meta ($ post-> ID, '_tes_meta_title', true); $ tes_meta_description = get_post_meta ($ post-> ID, '_tes_meta_description', true); // Lägg till ett nonce-fält så vi kan kontrollera efter det när vi validerar wp_nonce_field ('tes_inner_custom_box', 'tes_inner_custom_box_nonce'); eko "
Titel Tagg:
Meta Beskrivning:
';

Förklaringen av tes_mb_function koden ovan är som följer:

  • Hämta och lagra metadata-värdena i en variabel endast om den finns. Detta görs för att fylla i fälten med dess värden när den presenteras i databasen.
  • Ett nonce-flöde läggs till så att vi kan kontrollera efter det senare under verifieringen innan uppgifterna i formulärfälten sparas i databasen.
  • HTML-formuläret som består av ett textfältinmatningselement och ett textområde för att fånga respektive titel- och beskrivningstaggdata är echoed / tryckt.

Vid denna tidpunkt bör du se meta-rutan på post- och sidskärmen.


Spara Meta Box Data

En metakassa är inte färdig förrän den kan spara dataen till databasen. Namnet på funktionen för hantering av data sparas tes_mb_save_data. Koden är som följer.

funktion tes_mb_save_data ($ post_id) / * * Vi måste verifiera detta kom från vår skärm och med rätt behörighet, * eftersom save_post kan utlösas vid andra tillfällen. * / // Kontrollera om vår nonce är inställd. om (! isset ($ _POST ['tes_inner_custom_box_nonce'])) returnera $ post_id; $ nonce = $ _POST ['tes_inner_custom_box_nonce']; // Verifiera att nonce är giltigt. om (! wp_verify_nonce ($ nonce, 'tes_inner_custom_box')) returnera $ post_id; // Om det här är en autosave har vår formulär inte skickats in, så vi vill inte göra någonting. om (definierat ('DOING_AUTOSAVE') && DOING_AUTOSAVE) returnera $ post_id; // Kontrollera användarens behörigheter. om ('page' == $ _POST ['post_type']) if (! current_user_can ('edit_page', $ post_id)) returnera $ post_id;  annars om (! current_user_can ('edit_post', $ post_id)) returnera $ post_id;  / * OK, det är säkert för oss att spara data nu. * / // Om gamla poster finns, hämta dem $ old_title = get_post_meta ($ post_id, '_tes_meta_title', true); $ old_description = get_post_meta ($ post_id, '_tes_meta_description', true); // Sanitera användarinmatning. $ title = sanitize_text_field ($ _POST ['tes_meta_title']); $ description = sanitize_text_field ($ _POST ['tes_meta_description']); // Uppdatera metafältet i databasen. update_post_meta ($ post_id, '_tes_meta_title', $ title, $ old_title); update_post_meta ($ post_id, '_tes_meta_description', $ description, $ old_description);  add_action ('save_post', 'tes_mb_save_data');

Låt oss undersöka ovanstående kod:

  • Först kontrollerar vi att det här kom från vår skärm och med korrekt godkännande, för spara inlägget kan utlösas vid andra tillfällen och också verifiera att nonceen tidigare satt i tes_mb_function är giltig.
  • Då, om en post redan finns i databasen, hämtar vi den och lagrar den i $ OLD_TITLE och $ old_description variabel. Vi gör det här eftersom update_post_meta funktion som sparar data till databasen kräver eventuellt att ett gammalt värde ska kontrolleras före uppdatering av metaboxdatabasenrad med de nya värdena.
  • Därefter blir de inlämnade data saniterade med WordPress ' sanitize_text_field funktion som konverterar HTML till dess enhet, band alla taggar, ta bort radbrytningar, flikar och extra blankutrymme, band oktetter.
  • Metadata uppdateras till databasen via update_post_meta.
  • Slutligen, den tes_mb_save_data är ansluten till spara inlägget Åtgärd för att spara metaboxdata när posten eller sidan uppdateras.

Användning av sparade data

Glöm inte att sparade data ska användas för att lägga till en Open Graph-titel och beskrivning samt meta description taggen i huvud element på varje sida.

För att göra detta skapar vi en funktion som heter tes_mb_display som kommer att innehålla de önskade taggarna och därefter, koppla in den  wp_head verkan.

funktion tes_mb_display () global $ post; // hämta metadatavärdena om de existerar $ tes_meta_title = get_post_meta ($ post-> ID, '_tes_meta_title', true); $ tes_meta_description = get_post_meta ($ post-> ID, '_tes_meta_description', true); eko "      ';  add_action ('wp_head', 'tes_mb_display'); 
  • För att lyckas upptäcka post-ID, tar vi en referens till posten med hjälp av $ post objekt globalt.
  • Metadata hämtas sedan från databasen och sparas till $ tes_meta_title och $ tes_meta_description variabler. 
  • Därefter definierade vi metataggen som skulle införas i mallen huvud element.
  • Slutligen kopplar vi funktionen till wp_head.

Om du har lagt till och sparat en titel och en beskrivning mot ett inlägg eller en sida, bör du visa den här sidkällan om närvaron av Open Graph-titel och beskrivningstaggen tillsammans med metabeskrivning som används av sökmotorer.

Sammanfattning

I den här artikeln skapade vi en grundläggande SEO-plugin som lägger till en metabeskrivning och Open Graph-taggar som används av sökmotorns sociala nätverk till rubrikavsnittet i WordPress.

Vi lärde oss hur man skapar metakasser, formar fält, sanerar data innan de sparas i databasen och hämtar sparade data för användning.
En extra uppgift att lära dig mer om den här processen: Utvid detta plugin och lägg till ett meta-nyckelordfält i metakassformen och inkludera det bland de taggar som läggs in i WordPress-rubriken.