Customization

Hey,
I would like to make these changes

On all platform:
– make the icon account and cart in bold
– change the color of menu in footer and put in black remove the bold on selected menu, i tried check screen shot but its no working
– hide dropdown menu account icon

On mobile:
– make the add to card button as large of the weight
– htlm block which is 25/25/25/25 on desktop but on mobile all rows make a line I would like 50/50 and 50/50 in 2 lines
– footer which is 25/25/50 on desktop I would like to make the 50/50 and 100% in 2 lines

Thank you very much for your help.
Have a great day
Romain

Hello,

Please elaborate both of your requirements with some relevant screenshots to check it myself and help you out accordingly.

Best Regards

You will find below all the screenshot.

1) make the icon account and icon cart in bold as you can see because title is in bold the icons in regular make something weird.

2) change the color of menu in footer and put in black remove the bold on selected menu, i tried check screen shot but its no working

3) hide dropdown menu account when hover the account icon

4) make the add to card button as large of the weight like the update card button but keep in black

5) htlm block which is 25/25/25/25 on desktop but on mobile all rows make a line I would like 50/50 and 50/50 in 2 lines

6) footer which is 25/25/50 on desktop I would like to make the 50/50 and 100% in 2 lines

Hello,

1) Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.whb-header .wd-tools-icon:before {
    font-weight: bold;
}

2) Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.widget_nav_menu ul li.current_page_item>a {
    font-weight: normal;
}

.widget_nav_menu ul li a {
    color: #000;
}

3) Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.wd-dropdown.wd-dropdown-menu.wd-dropdown-my-account.wd-design-default {
    display: none;
}

4) Please try adding the following Custom CSS in the Custom CSS for Mobile area under Theme Settings >> Custom CSS.

.product-type-simple form.cart,
.woocommerce-variation-add-to-cart {
  display: flex;
}
.product-type-simple form.cart > button,
.woocommerce-variation-add-to-cart > button {
  flex-grow: 1;
}

5) You can try achieving this by creating separate columns for devices and hide for the particular devices you need.

You can read the following article for help: https://elementor.com/help/show-or-hide-columns-per-device/

Best Regards

Hello,

We turn on production our website and we discover some issues. I have fews inquiries:

1) Remove hover when dark mode enable. Exemple for the menu text in white #FFF which become grey #D5D6D5
2) Delete / Hide “In Stock” and “Out of stock” when variations selected on product page.
3) Hide price for out of stock variation. We found a code for product which are totally out of stock

.outofstock .price {
    display:none
}

it works for products totally out of stock. However it did not work for product with one variation in stock.
4) Delete the space for payment description.
5) Hide paiement method section on account

All screenshots are bellow.

Thank you for your help.
Sincerely,
Romain

Hello,

1) Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.wd-nav[class*=”wd-style-“]>li>a:hover {
color: white;
}

2) Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.variations_form .woocommerce-variation-availability p.stock {
display: none;
}

3) This is not possible with simple Custom CSS. It requires customizations and this is beyond our limitations and support policy.

4) Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.payment_methods .payment_box {
margin-top: 0;
padding: 0;
}

5) Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link–ly_saved_cards {
display: none;
}

Best Regards

[Author]

Posts