Als je een WooCommerce webshop hebt dan wil je het liefst niet dat klanten eerst klikken vanuit de productcategorie naar een product en er daar achterkomen dat het product niet leverbaar is.

Uitverkochte producten in shop

Je kunt dit voorkomen door uitverkochte producten in jouw webshop te verbergen. Een andere optie is het tonen van een ‘uitverkocht’ label op de overzichtspagina. Sommige WordPress thema’s voegen dit automatisch toe. Mocht jouw thema dit niet ondersteunen dan zou je deze code kunnen gebruiken. Voeg deze toe in je functions.php van je thema of gebruik een plugin als Code Snippets.

add_action( ‘woocommerce_before_shop_loop_item_title’, ‘bbloomer_display_sold_out_loop_woocommerce’ );

function bbloomer_display_sold_out_loop_woocommerce() {
global $product;
if ( ! $product->is_in_stock() ) {
echo ‘<span class=”soldout”>Tijdelijk niet leverbaar</span>’;
}
}

Uitverkocht badge stylen

Uiteraard kun je de melding ook stylen. Gebruik hiervoor de volgende CSS in je stylesheet of in de customizer.

.soldout {
    padding: 3px 8px;
    text-align: center;
    background: #222;
    color: white;
    font-weight: bold;
    position: absolute;
    top: 6px;
    right: 6px;
    font-size: 12px;
}

Feedback

Heb je na het lezen van dit artikel nog vragen of zijn er onduidelijkheden? Werkt de code niet op jouw website? Laat het ons weten, dan kunnen wij je misschien verder helpen.

Feedback kennisbankartikel

Naam
Dit veld is bedoeld voor validatiedoeleinden en moet niet worden gewijzigd.

Mis geen WordPress tips meer.

Al 500+ webdesigners en marketeers ontvangen deze nieuwsbrief.

Naam
Dit veld is bedoeld voor validatiedoeleinden en moet niet worden gewijzigd.

Mis nooit meer website tips.

Al 500+ webdesigners en marketeers ontvangen onze nieuwsbrief.

Naam
Dit veld is bedoeld voor validatiedoeleinden en moet niet worden gewijzigd.