Toolbox van de Smart WordPress Developer CMB2

Ooit geprobeerd om metaboxen te bouwen in WordPress? Het is een puinhoop, niet alleen voor beginners, maar zelfs voor gevorderde WordPress-ontwikkelaars. Gelukkig voor de WordPress-gemeenschap, kan de gemeenschap zelf elegante oplossingen bedenken voor dit soort rommelige problemen. CMB2 is er een van.

In dit deel van de "Toolbox van de Smart WordPress Developer" -reeks gaan we door CMB2, een uitgebreide bibliotheek voor het ontwikkelen van aangepaste metaboxen en formulieren in WordPress.

De extreem onaangepaste manier om aangepaste metaboxen te maken

Aangezien dit geen zelfstudie is over het maken van aangepaste metaboxen, ga ik je niet leren hoe je dit moet doen door kernfunctionaliteit te gebruiken, maar ik zal een paar nuttige links plaatsen. In plaats daarvan ga ik over de alledaagse routine van het:

De metabox maken: Toegegeven, de essentiële en even CMB2 van dit onderdeel gebruikt een vergelijkbare manier om het te doen - je moet de aangepaste metabox maken met behulp van de add_meta_box () functie ... binnen een functie die haakt aan de add_meta_boxes actie. Niet te gemakkelijk, niet te moeilijk, maar tussen de twee in.

Maak de velden om weer te geven in de metabox: In dit deel moet je een aparte functie maken (waarnaar je ook moet verwijzen in de add_meta_box () functie) en schrijf er vanille HTML in, zoals divs en labels en invoers, om uw formuliervelden weer te geven, wat niet werkt, tenzij je de HTML bindt met gecompliceerde PHP. Tekstinvoer is prima, maar maakt vervolgkeuzemenu's of selectievakjes? Bereid je voor op verwarring. (Laat me niet eens beginnen met bestandsuploads en kleurkiezers.) Oh, je bent vergeten te gebruiken wp_nonce_field () voor Veiligheid? Jammer, je code zal nooit werken.

Sanitize en bewaar de veldwaarden: Ja. Om ervoor te zorgen dat het formulier de gegevens opslaat, moet u nog een andere functie gebruiken om een ​​aantal dingen te controleren, de gegevens te zuiveren en de waarden op te slaan in uw aangepaste metabox. En je moet die functie aansluiten op de save_post actie. Netjes.

Als je het "de kernmanier" wilt doen en uitgeven uur bij het maken van een paar metaboxen, nou ja, goed voor jou, het nemen van de high road. Maar er kan natuurlijk een tijd komen dat je geen helper-frameworks zoals CMB2 zult kunnen gebruiken. In dat geval kun je verwijzen naar deze SitePoint-tutorial van Narayan Prusty of deze uitgebreide reeks tutorials van Tom McFarlin over Tuts + Code.

Voer CMB2 in: de buitengewoon geweldige manier om aangepaste metaboxen te maken

En wat als ik u zou vertellen dat u aangepaste metaboxen kunt maken door een functie te maken die inhaakt op één actie en zeer slimme functies te gebruiken die al het harde werk doen om de HTML te maken en alles magisch samen te binden? En geloof me, ik overdrijf niet eens een klein beetje!

Met de hulp van CMB2 kunt u aangepaste metaboxen maken in een fractie van de tijd die u zou besteden aan het doen van dit "de kernmanier".

CMB2 instellen

CMB2 kent twee vormen: in de plugin-vorm en in de kadervorm. Als je CMB2 gaat gebruiken in projecten die niet voor een community worden vrijgegeven, raad ik aan de plug-in te gebruiken, omdat het updaten van de CMB2-plug-in veel eenvoudiger zou zijn en je de bestanden niet hoeft op te nemen van de CMB2-motor. Maar als u uw project aan een community gaat aanbieden, kunt u beter CMB2 integreren in het project door de bestanden van GitHub te downloaden, ze in de map van uw project te plaatsen en de onderstaande regels te gebruiken:

Houd er natuurlijk rekening mee dat je de bovenstaande regels moet bewerken om naar CMB2's te verwijzen init.php het dossier.

Uw eerste aangepaste Metabox maken

Voordat we onze eerste metabox maken, moeten we onze enige functie maken die zal aansluiten op die van CMB2 zelf cmb2_init actie:

Daarna is het maken van de metabox net zo eenvoudig als het maken van een nieuwe variabele:

 'test_metabox', 'title' => 'Test Metabox', 'object_types' => array ('page', 'post', 'customposttype'), // post type 'context' => 'normaal', // ' normaal ',' geavanceerd 'of' side 'priority' => 'high', // 'high', 'core', 'default' of 'low' show_names '=> true, // toon veldnamen aan de linkerkant' cmb_styles '=> false, // false om de CMB-stylesheet' closed 'uit te schakelen => true, // houd de metabox standaard gesloten)); ?>

Uw aangepaste metabox vullen met velden

Na het maken van onze eerste aangepaste metabox, is het tijd om het nuttig te maken door het te vullen met "velden" die CMB2 biedt. En dat is net zo eenvoudig als het uitvoeren van een functie met de metabox-variabele die we zojuist hebben gemaakt:

add_field (array ('name' => 'Test Title', 'desc' => 'Dit is een titelbeschrijving', 'type' => 'title', 'id' => 'wiki_test_title')); // email input $ cmb-> add_field (array ('naam' => 'Test Tekst Email', 'id' => 'wiki_test_email', 'type' => 'text_email',)); // file uploader $ cmb-> add_field (array ('name' => 'Testbestand', 'desc' => 'Upload een afbeelding of voer een URL in', 'id' => 'wiki_test_image', 'type' => 'bestand', // Optioneel verbergt u de tekstinvoer voor de url: 'options' => array ('url' => false,),)); // herinner me toen ik zei dat het doen van een kleurenkiezer superhard zou zijn als kernfuncties worden gebruikt? $ cmb-> add_field (array ('name' => 'Test Kleurkiezer', 'id' => 'wiki_test_colorpicker', 'type' => 'colorpicker', 'default' => '#ffffff',)); ?>

Er zijn meer dan 30 veldtypen beschikbaar door CMB2, inclusief gewone tekstinvoer, WYSIWYG-editors, datumkiezers, kleurkiezers, bestandsuploaders en zelfs taxonomieselectoren. Raadpleeg deze Wiki-pagina van CMB2 voor een volledige lijst met veldtypen.

Nog meer Awesomeness

Het maken van volledig functionerende aangepaste metaboxen is geweldig zoals het is, maar CMB2 stopt hier niet. Er zijn een heleboel dingen die je kunt doen met CMB2:

  • U kunt CMB2 gebruiken om een ​​optiepagina voor uw thema te maken.
  • U kunt CMB2 laten werken om postinzendingsformulieren te maken.
  • U kunt uw eigen toevoegen laat zien filters en conditioneel tonen of verbergen uw metaboxen.
  • En u kunt zelfs uw eigen veldtypen maken.

Om meer te weten te komen over de superkrachten van CMB2 zoals deze, zijn er enkele pagina's die je kunt bekijken:

  • Externe bronnen voor CMB2
  • De "Tips & Tricks" -pagina op de CMB2 Wiki
  • CMB2-fragmentbibliotheek, een pagina die enkele zeer nuttige codefragmenten bevat
  • De blog van WebDevStudios, makers van CMB2

Inpakken voor vandaag

Het valt niet te ontkennen dat vasthouden aan de kern van WordPress tijdens het bouwen van dingen niet altijd zo eenvoudig is als het klinkt. Het gebruik van helper-frameworks zoals CMB2 zal onze ontwikkelingsprocessen dus versnellen. En ik geloof dat hoewel CMB2 zo geweldig is als het nu is, het veel meer ruimte heeft om te verbeteren (niet alleen op het gebied van aangepaste metaboxen, maar ook in andere richtingen), dus ik zou dit in de gaten houden project als ik jou was.

Tot ziens in het volgende deel, waar we het over WP-CLI hebben, een unieke WordPress-tool die ons de mogelijkheid biedt om onze WordPress-installaties via de opdrachtregel te beheren.