Hoe laat je een productlijst zien in Woocommerce met een bepaald attribuut als filter
Wil je graag op een aparte pagina, die je via een menu-item kan aanroepen, een productoverzicht tonen dat is gefilterd op een specifiek product attribuut in WooCommerce maar weet je niet hoe? Dan leg ik je uit hoe je dat in een paar eenvoudig stappen voor elkaar kan krijgen.
Toen ik bezig was met de ontwikkeling van een nieuwe website voor een van mijn klanten liep ik tegen de beperking aan die wordt geboden in de standaard WooCommerce oplossing. Ik wilde graag het occasion aanbod van een bepaalde carrosserie keuze (Terreinwagen) laten tonen en die via een menu keuze beschikbaar maken. Eerst gekeken of ik een widget kon aanmaken in een pagina die een product attribuut als filter gebruikte, later nog gekeken of ik het niet als “tag” kon laten zien (dat kan overigens) maar ik dacht, het moet toch gewoon kunnen? Gelukkig kan dat ook. Het enige wat je ervoor hoeft te doen is een add_filter aanmaken in je functions.php bestand en een nieuwe template maken (copy van bestaande) voor de vertoning van het specifiek product attribuut in WooCommerce.
Hoe ga je te werk?
Allereerst moeten we een functie en filter aanmaken. Dit doe je door de onderstaande code toe te voegen aan het bestand functions.php dat je kan vinden in de directory van de template die je gebruikt (vb. /httpdocs/wp-content/themes/twentyfourteen/functions.php) :
add_filter('woocommerce_attribute_show_in_nav_menus', 'wc_reg_for_menus', 1, 2);
function wc_reg_for_menus( $register, $name = '' ) {
if ( $name == 'pa_carrosserie' )
$register = true;
return $register; }
Vervang hier “pa_carrosserie” met de slug die je gebruikt voor je product attribuut (maat, kleur, geslacht, whatever)
Het volgende wat je moet doen, of eigenlijk zou moeten willen, is een nieuwe template aanmaken voor het vertonen van je product overzicht dat voldoet aan dit specifieke filter. Die doe je door een kopie te maken van het bestand taxonomy-product_cat.php, deze vind je doorgaans in de folder /wp-content/plugins/woocommerce/templates/, en deze te hernoemen naar taxonomy-pa_carrosserie.php (of taxonomy-pa_maat.php, taxonomy-pa_kleur.php of taxonomy-pa_geslacht.php) en deze vervolgens te plaatsen in de folder van je actieve template. Dat is de folder waarin je eerder de aanpassing van de functions.php hebt gedaan.
Ga nu naar je wp-admin gedeelte en kies Weergave > Menu’s. Hier zie je als het goed is een nieuwe optie om een menu item uit te maken die de naam heeft gekregen van je product attribuut. Zet een vinkje voor het product attribuut waar je een specifieke pagina voor wilt aanmaken vanuit een menu en zet hem op de gewenste plek. Opslaan en klaar!
