i have this store http://zdk.pt/iberwear , when you click to enter the website , woocommerce categories appear on the left side, when i click for example http://zdk.pt/iberwear/categoria-produto/industrialeconstrucao/, i want to change the color of the selected category in this case "industrial/construção ( industrial / construction)" can anyone help ?
If you on category page then current category has added class .current-cat in navigation, use it and should work.
.product-categories .current-cat a {
color: red;
}
Related
I would change the color of the menu items in wordpress. In this site https://www.modacapellishop.it/ I have four voices in the menu (Brand, Prodotti, Modacapelli Choice, Outlet) and I need to change the color of Modacapelli Choice (grey to blue). I added this code on the CSS file:
/* Change color menu Modacapelli Choice */
#menu-item-427 a {
color: #2976ce;
}
It work but just on desktop. On the mobile version in menu navigation sidebar the menu item "Modacapelli Choice" doesn't change the color.
How can I solve that?
Since this is an extremely specific case you can either .menu-item-427 > a { color: red!important; } or do .nav>li.menu-item-427>a { color: red; }
I would recommend the latter.
However both are not great, since it is bound to the ID. I would recommend making an ACF field for the page or the menu-element, then checking if it exists, and creating an inline style or adding a class if it is true.
The user can then also change the color of other elements he wishes to change without contacting you about it.
You would then add a class like this to your menu markup for example.
.is-highlighted-element {
color: red;
}
In Mobile view doesn't have #menu-item-427 this id. so replace with .menu-item-427
Try this css it's works
.menu-item-427 a {
color: #2976ce;
}
main category slug name is car-battery. I want to display all sub categories of it as a list when click on it.
I have tried css code
.product-loop-categories .product-category a {
background-color: transparent;
}
.product-loop-categories .product-category a img {
display: none;
}
This code displays all categories as a list. I want to achieve only for one main category. How to do it
I’m using the Shop Konado theme.
I'm trying to disable the hover effect of the products and leave the "buy" button always visible in the mobile version: https://prnt.sc/t2ul5l (print from my store). Another example: https://prnt.sc/luen4q
I tried to use the following code in the additional Wordpress css:
html .shop-item:hover .shop-item-image:after {
background: none;
}
But it did not work.
This is my store:
https://www.arteverdeagro.com.br/loja/product-category/todos-os-produtos-in-natura/
thanks for the help
This should work.
.box-hover{
opacity: 1 !important;
margin-top:10px !important;
}
https://i.stack.imgur.com/iGdyc.png
same : i.stack.imgur.com/7Cogs.png
I wait hide it
how to ?
i want hide it on site me , and only show price
Get the css selector and use display none.
.your-product-title{
display: none;
}
I am using the woocommerce product category widget on my sidebar and footer widget area.
I have 2 parent categories. I would like these to be displayed, but not be clickable links.
You can see the page here http://www.terrykirkwood.co.uk/w
Can anyone advise what css to add to stop these links being clickable?
Thanks
Here's the code from the first occurrence:
<li class="cat-item cat-item-47 cat-parent">Original Paintings<ul class="children">
CSS only controls style, so there is no CSS you can use to disable a hyperlink. You could change the CSS to not change cursors, so it doesn't "look" like a link.
.cat-parent a {
cursor: default;
text-decoration: none;
}
.cat-parent .children a {
cursor: pointer;
text-decoration: underline;
}
And then use some jQuery to actually disable the click function:
$('.cat-parent').click(function(e) {
e.preventDefault();
});
If you were bold you could probably also modify the widget to not print an <a> link for parents, but I can't check on that right now.
Edit
You can either add the script to one of your theme's scripts, load a new external script file or drop the following into your themes' functions.php:
function so_add_this_script_footer(){
if( !is_admin() ) { ?>
<script>
jQuery(document).ready(function($) {
$('.cat-parent > a').click(function(e) {
e.preventDefault();
});
});
</script>
<?php }
}
add_action('wp_print_footer_scripts', 'so_add_this_script_footer');
All parent classes have a 'cat-parent' class, so you can either add a condition - 'javascript: void(0)' - in widget for anchor tag 'href'.
Alternatively , you can add the below jquery code,
jQuery('.footer-widget').find('.product-categories li.cat-parent').each(function(){
if(jQuery(this).find('ul.children').length == 1){
jQuery(this).find('a').attr('href','javascript: void(0)');
}
});
This will reset all parent category links that have child categories. Now, If user clicks on parent category, it will not do anything.
This will also make sure, that if parent categories don't have child categories, then it will not be reset.