Basel, un tema sviluppato per WordPress dal team “xtemos”, è minimalista, professionale e progettato per produrre un sito web di tipologia e-commerce moderno ed efficace che si adatta perfettamente alla risoluzione di qualsiasi schermo. Il tema è molto versatile e può essere utilizzato per qualsiasi tipologia di negozio on-line, inoltre, può essere trasformato in un catalogo di prodotti senza utilizzare componenti aggiuntivi, che potrebbero appesantire il sistema, mediante l’utilizzo di alcune funzionalità del tema stesso ed integrando codice PHP e CSS. In questo articolo ipotizziamo di partire da un sistema e-commerce già esistente.

Iniziamo le modifiche abilitando la “modalità catalogo” dalle opzioni del tema, come mostrato nell’immagine seguente:

Come abbiamo detto in precedenza, stiamo ipotizzando di agire in un sistema e-commerce già esistente, quindi abbiamo la necessità di nascondere i prezzi, a tale scopo inseriamo all’interno del file functions.php del tema il codice seguente:
/* nascondi i prezzi */
add_filter( 'woocommerce_get_price_html', 'remove_price');
function remove_price($price){
return ;
}
Se desideriamo nascondere ii codice del prodotto, inseriamo all’interno del file functions.php del tema il codice seguente:
/* nascondi il codice del prodotto */
function remove_product_page_skus( $enabled ) {
if ( ! is_admin() && is_product() ) {
return false;
}
return $enabled;
}
add_filter( 'wc_product_sku_enabled', 'remove_product_page_skus' );
Se desideriamo nascondere il badge “in offerta” nella pagina del prodotto, inseriamo all’interno del file functions.php del tema il codice seguente:
/* nascondi in offerta */
add_filter('woocommerce_sale_flash', 'lw_hide_sale_flash');
function lw_hide_sale_flash()
{
return false;
}
Se desideriamo nascondere ii badge “esaurito” dalla pagina del prodotto, inseriamo il codice CSS seguente:
.product-label.out-of-stock {
display: none;
}
Se desideriamo nascondere ii badge “esaurito” dalla pagina del catalogo, inseriamo il codice CSS seguente:
.woocommerce span.onsale {
display: none;
}