WooCommerce voor Waaghalzen – 5 gevorderde tips voor WooCommerce (deel 1)

De plugins voorbij…

Je kan eigenlijk heel veel met WooCommerce, wat niet zo verwonderlijk mag zijn, omdat er ook heel veel mogelijk is met WordPress zelf. Soms wil je echter een paar van die kleine dingetjes wijzigen, die allemaal ‘net niet’ te vinden zijn in een plugin. Maar wist je dat je met een paar eenvoudige regels PHP code, de programmeertaal achter WordPress, zelf heel makkelijk aanpassingen kunt doen?

Nu wil ik je beslist geen cursus PHP geven hier in deze blog, maar wat ik je wel wil laten zien, is hoe je met een aantal eenvoudige regels code net die paar irritante zaken, die niet wilden werken als je graag gezien had aan kunt passen.

Maar voor de kunnen beginnen hebben een plaats nodig, waar we deze code kunnen plaatsen. WordPress moet namelijk in staat zijn jouw code op de juiste momenten te lezen. En dit kunnen we op een aantal manieren doen. Eén manier die je waarschijnlijk wel vaker in tips tegen zal komen, is dit te plaatsen in een bestand in je thema wat ‘functions.php’ heet. Dat is een heel goed idee, indien je tenminste een child theme gebruikt’. Doe je dat niet, dan word je in ieder geval heel ervaren met PHP, want na iedere upgrade van je thema mag je die code opnieuw toevoegen.

Je eigen WooCommerce plugin maken. Jawel!

Ik had je gewaarschuwd dat dit gevorderde tips voor WooCommerce waren, nietwaar? Wat jij nu gaat doen is je eigen plugin voor WooCommerce maken. Misschien dat ik in een toekomstig artikel nog eens uitleg, waarom je bepaalde dingen doet, nu hebben we het even alleen over het hoe.

Je begint met het maken van een bestand met een unieke naam. Uniek op jouw systeem wel te verstaan, want laat ik eerlijk zijn. Deze plugin gaat heel specifiek worden en alleen voor jou geschikt. Dus dromen over snel rijk worden met het maken van plugins mag je nog even uitstellen. Wat wel belangrijk is, is dat je het bestand op .php laat eindigen. Dus bijvoorbeeld ‘jan-zijn-woocommerce-plugin.php’.

Om dit bestand aan te maken, kunnen we gewoon ‘notepad’  op Windows gebruiken, maar nu we toch serieus bezig gaan, kunnen we natuurlijk net zo goed een serieus ‘editor’ programma installeren. Voor Windows is bijvoorbeeld NotePad Plus Plus, wat overigens niets met je Windows Notepad te maken heeft, er zo eentje. Voor de Mac zou ik niet zo snel een gratis tekst editor weten, maar Google is hier je beste vriend.

En zo maken we van een bestand een plugin

Het volgende wat je doet, is de code hieronder met knippen en plakken in je editor plaatsen.

<?php
/*
Plugin Name: Jans Puike Plugin
Description: Jippie, mijn WooCommerce Plugin
Version: 0.1.0
Author: Jan de Groenteman
*/

Je hebt misschien wel eens plugin headers gezien met veel meer informatie, maar deze is niet noodzakelijk. Wanneer je deze plugin nu al zou installeren, dan heb je al een heuse plugin. Het enige nadeel is dat hij nog niets doet. Maar dat komt straks.

Belangrijke zaken om rekening mee te houden

Je ziet dat het bestand begint met <?php. Voor een pluginbestand is het vooral belangrijk dat hier helemaal niets voor mag staan. Geen spaties, geen witte regels. Niets.

Een tweede belangrijk punt is, dat je je plugin altijd eerst test op een site ‘die er niet zoveel toe doet’, of liever nog, lokaal. Gisteren verscheen  in deze blog een artikel over hoe je lokaal je eigen WordPress versie neer kunt zetten.

En aangezien we een WooCommerce functies schrijven, is het belangrijk, dat je eerst ook WooCommerce installeert. Normaal zou je -als je een commerciële WooCommerce plugin maakt- in de plugin testen of WooCommerce geinstalleerd is, maar aangezien deze plugin alleen voor jou is, weet je het zelf vast het beste.

Ten slotte maak je natuurlijk altijd eerst een backup.

Het werkt niet (maar geeft ook geen foutmelding)

Het is mogelijk, dat de veranderingen die je in de code doorvoert niet zichtbaar worden binnen je webwinkel. Als dat zo is, probeer dan eens of het wel werkt met het Twenty Seventeen thema van WordPress of met StoreFront van WooCommerce. Werkt dat wel, dan heb jij niets fout gedaan, maar de maker van het thema. Een goed ‘WooCommerce enabled’ thema moet op bepaalde punten in de code rekening houden met ‘aanpas code’ die jij zelf aanroept, zoals in de voorbeelden in dit artikel. Niet ieder thema doet dit echter. Wat je het best kunt doen is contact opnemen met de maker van je thema, of gewoon een ander thema kiezen.

Tip 1 : De WooCommerce product tabbladen in een andere volgorde zetten

Eén van de meest frequente vragen die ik ontvang met betrekking tot ‘kleine aanpassingen’ in WooCommerce heeft betrekking op de tabbladen van het product. In deze eerste tip laat ik je zien, hoe je de volgorde van deze tabbladen aan kunt passen.

add_filter( 'woocommerce_product_tabs', 'jans_woo_reorder_tabs', 98 );

function jans_woo_reorder_tabs( $tabs ) {
   $tabs['reviews']['priority'] = 5; // Reviews first
   $tabs['description']['priority'] = 10; // Description second
   $tabs['additional_information']['priority'] = 15; // Additional information third
   return $tabs;
}

In het voorbeeld hierboven laten we eerst de ‘Reviews’ pagina eerst zien, daarna de productomschrijving en tenslotte de extra informatie. Wil je nog een andere volgorde? Door te spelen met de volgorde van de regels die met $tabs beginnen en het cijfer voor de prioriteit overeenkomstig aan te passen, kun de tabs in iedere gewenste volgorde zetten.

Wanneer je dit nuttige functionaliteit vindt, plak je deze code naar je zelfgemaakte plugin bestand.

Wat belangrijk is, is dat een functie een unieke naam heeft. In ons voorbeeld hierboven hebben we daarom ‘jans_’ voor alle functienamen gezet. Zo’n code als ‘jans_’ noemen we een functie-prefix. Het is goed om je eigen prefix te gebruiken voor al je functies. Zelf gebruik ik voor WordXPression bijvoorbeeld ‘wxp_’. Het is gebruikelijk -maar niet verplicht- om zo’n ‘prefix’ te scheiden van de rest van de functienaam met een underscore. Tekens in een functienaam mogen letters, cijfers en underscores zijn.

Tip 2 : WooCommerce tabbladen verwijderen

Misschien wil je helemaal niet de volgorde aanpassen, maar juist één of meerdere tabbladen verwijderen. Ook dat is mogelijk. Kijk eens naar onderstaande code.

add_filter( 'woocommerce_product_tabs', 'jans_woo_remove_product_tabs', 98 );

function jans_woo_remove_product_tabs( $tabs ) {
    //unset( $tabs['description'] );      	// Remove the description tab
    //unset( $tabs['reviews'] ); 			// Remove the reviews tab
    //unset( $tabs['additional_information'] );  	// Remove the additional information tab
    return $tabs;

}

Laat mij om te beginnen één geheimpje verklappen. Deze code verandert helemaal niets aan je tabbladen. Het geheim zit hem namelijk in de twee slashes (//), die schakelen als het ware de code daarachter uit. Wil je echter één van de tabbladen verwijderen, verwijder dan de twee slashes die er voor het woordje ‘unset’ staat. Ook dit kopieer je natuurlijk -als je de functionaliteit wenst- naar je plugin bestand.

De volgende drie tips…

Het artikel heet ‘5 tips’ en ik geef er maar twee? Speel ik nu vals? Welnee! Overmorgen wordt het tweede artikel al geplaatst. Maar omdat ik mijn blogartikelen liever niet te lang maak, moest ik het artikel voor vandaag helaas wat inkorten. Aan de positieve kant: Je hoeft niet zoals gebruikelijk twee weken te wachten op een vervolg. Ondertussen kan je in ieder geval wat aan de slag gaan met de voorbeelden die je hier vindt.

Ik ben van plan vaker dit soort ‘doe het zelf’ artikelen rond WooCommerce en WordPress te plaatsen. Ik heb echter geen idee, of dat ook daadwerkelijk in jouw behoefte voorziet. Ik zou het daarom zeer op prijs stellen indien je in het commentaar hieronder antwoord op één of meer van de volgende vragen zou willen geven.

• Los van of je de hier besproken functionaliteit wel of niet wilt, voel jij je ‘veilig genoeg’ met WordPress om zelf dit soort aanpassingen te doen?
• Indien ja, Wat zijn punten die jou op dit moment storen in de presentatie van WordPress of WooCommerce, die je nog niet met een plugin op hebt kunnen lossen?
• De code hier is technisch gezien wel een ‘plugin’, maar met een echte plugin moet je natuurlijk meer kunnen. Zou jij eventueel interesse hebben voor een diepgaandere technische cursus WordPress of WooCommerce, waarin je zelf plugins leert maken?

In dit blogartikel geef ik onder meer antwoord op de volgende vragen

• Hoe maak ik zelf een plugin
• Hoe pas ik de WooCommerce tabbladen aan
• Op welke manier kan ik WooCommerce verder aanpassen
• Waar vind ik voorbeelden van WooCommerce hooks (filters en actions)