Solved

Can I modify the color of a specific Shopify menu?

John_Starc
Excursionist
25 2 3

Hi,

I want to change the color for a specific menu and that menu is SALE along with all subcategories.

Here is the URL https://www.cloudstore.pk/collections/just-arrived please help to change the SALE color in Red.

 TIA. 

Accepted Solutions (3)

MarinaPetrovic
Shopify Partner
552 124 178

This is an accepted solution.

Hi @John_Starc , fastest solution is - go to edit code > assets > base.css and add this:

#HeaderMenu-MenuList-5 li a,
#Details-HeaderMenu-5 span{
color:red;
}

 

Please note that if you change order in your menu this will be changed too. 

M.Petrovic | Shopify Developer
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution

View solution in original post

Wish-It
Shopify Partner
151 37 41

This is an accepted solution.

Add this CSS if you want to change the color dropdown arrow to alongwith the of menu

#HeaderMenu-MenuList-5 li a, #Details-HeaderMenu-5 span {
    color: red;
}
#Details-HeaderMenu-5 .icon-caret {
    color: red;
}

 

Replace "red" with the color code that you want. You can add this code to bottom of base.css file or use an app like this to add custom css to any theme file.

I am founder of WishIt.app, you can create any theme edit task on our app - WishIt.app : Custom CSS / JS and we will do it for you. The first task is FREE!

Don't forget to checkout our reviews on Shopify AppStore.

View solution in original post

Wish-It
Shopify Partner
151 37 41

This is an accepted solution.

Add this CSS for mobile version,

details#Details-menu-drawer-menu-item-5 * {
    color: red;
}
I am founder of WishIt.app, you can create any theme edit task on our app - WishIt.app : Custom CSS / JS and we will do it for you. The first task is FREE!

Don't forget to checkout our reviews on Shopify AppStore.

View solution in original post

Replies 6 (6)

MarinaPetrovic
Shopify Partner
552 124 178

This is an accepted solution.

Hi @John_Starc , fastest solution is - go to edit code > assets > base.css and add this:

#HeaderMenu-MenuList-5 li a,
#Details-HeaderMenu-5 span{
color:red;
}

 

Please note that if you change order in your menu this will be changed too. 

M.Petrovic | Shopify Developer
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
John_Starc
Excursionist
25 2 3

Thank you for sharing. Working fine for the desktop, how it can be changed for mobile as well?

Wish-It
Shopify Partner
151 37 41

This is an accepted solution.

Add this CSS for mobile version,

details#Details-menu-drawer-menu-item-5 * {
    color: red;
}
I am founder of WishIt.app, you can create any theme edit task on our app - WishIt.app : Custom CSS / JS and we will do it for you. The first task is FREE!

Don't forget to checkout our reviews on Shopify AppStore.
John_Starc
Excursionist
25 2 3

It really works, thanks a lot. Can you do me another favor to align the product images at the collection page? As many of the images are not aligned and cant manage them manually because those are in large numbers so need any code to fix them. 

https://www.cloudstore.pk/collections/boys

 

Wish-It
Shopify Partner
151 37 41

The images are of different size, it would require theme code changes to set fixed height and get images fit within it. You can create it as a task here in our app, we can have a look and resolve it. The first task is free.

I am founder of WishIt.app, you can create any theme edit task on our app - WishIt.app : Custom CSS / JS and we will do it for you. The first task is FREE!

Don't forget to checkout our reviews on Shopify AppStore.

Wish-It
Shopify Partner
151 37 41

This is an accepted solution.

Add this CSS if you want to change the color dropdown arrow to alongwith the of menu

#HeaderMenu-MenuList-5 li a, #Details-HeaderMenu-5 span {
    color: red;
}
#Details-HeaderMenu-5 .icon-caret {
    color: red;
}

 

Replace "red" with the color code that you want. You can add this code to bottom of base.css file or use an app like this to add custom css to any theme file.

I am founder of WishIt.app, you can create any theme edit task on our app - WishIt.app : Custom CSS / JS and we will do it for you. The first task is FREE!

Don't forget to checkout our reviews on Shopify AppStore.