Category: WooCommerce

Adicionar este trecho no arquivo functions.php do tema. Com isso, categorias que não possuem nenhum produto não serão exibidas.

**
 * Ocultando categorias vazias do Woocommerce
 *
 */

add_filter( 'woocommerce_product_categories_widget_args', 'bbloomer_hide_empty_terms' );
 
function bbloomer_hide_empty_terms( $args ) {
$args['hide_empty'] = true;
return $args;
}

Para alterar a cor dos botões do WooCommerce, precisaremos alterar/substituir o estilo CSS padrão dos botões. Para fazer isso, precisaremos adicionar css personalizado ao tema do WordPress.

Existem duas maneiras de fazer isso:

1. Adicionando o CSS customizado no style.css do tema
2. Usando algum plugin para injetar o css personalizado nas páginas da web.

Quase todos os temas possui um módulo para isso, mas caso não tenha, pode-se usar este plugin para injetar o css nas páginas do site WooCommerce > CSS personalizado simples

• Etapa 1: Instale o plug-in em seu site e acesse o plug-in.
• Etapa 2: Vai em Aparência > Simple Custom CSS

Coloque o seguinte css na área de texto e clique em “Update Custom Css”.

.woocommerce #content input.button.alt:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .woocommerce-page #content input.button.alt:hover, .woocommerce-page #respond input#submit.alt:hover, .woocommerce-page a.button.alt:hover, .woocommerce-page button.button.alt:hover, .woocommerce-page input.button.alt:hover {
    background: red !important;
    background-color: red !important;
    color: white !important;
    text-shadow: transparent !important;
    box-shadow: none;
    border-color: #ca0606 !important;
}

.woocommerce #content input.button:hover, .woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover, .woocommerce-page #content input.button:hover, .woocommerce-page #respond input#submit:hover, .woocommerce-page a.button:hover, .woocommerce-page button.button:hover, .woocommerce-page input.button:hover {
    background: red !important;
    background-color: red !important;
    color: white !important;
    text-shadow: transparent !important;
    box-shadow: none;
    border-color: #ca0606 !important;
    text-transform: none !important;
}

.woocommerce #content input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce-page #content input.button, .woocommerce-page #respond input#submit, .woocommerce-page a.button, .woocommerce-page button.button, .woocommerce-page input.button {
    background: red !important;
    color: white !important;
    text-shadow: transparent !important;
    border-color: #ca0606 !important;
    text-transform: none !important;
}

.woocommerce #content input.button.alt:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .woocommerce-page #content input.button.alt:hover, .woocommerce-page #respond input#submit.alt:hover, .woocommerce-page a.button.alt:hover, .woocommerce-page button.button.alt:hover, .woocommerce-page input.button.alt:hover {
    background: red !important;
    box-shadow: none;
    text-shadow: transparent !important;
    color: white !important;
    border-color: #ca0606 !important;
    text-transform: none !important;
}

Vá para a página do produto WooCommerce ou página do carrinho, você verá os botões nas cores vermelha. Para alterar a cor dos botões, por exemplo, substitua o “backgroud: red !important” pela cor desejada. Clique em atualizar e estará pronto e pronto para uso.