Page 1 of 1
want to edit my navigation bar menu be likes here
Posted: Wed Aug 10, 2016 9:00 pm
by HusseinGomaa
Hi everybody,
I have opencart v2.2 and I want to edit my navigation bar menu be likes here.
Firstly: Navigation Menu:
1- How to separate between categories like that?
2- How to center the categories words like that?
3- How to change color of the navigation bar?
4- How to do pattern that?
Firstly: Product page:
1- How to change the image with selectio? - because I wanna when select (ex:color) reflect with iamge.
2- How to add note under "add to cart" button in product page?
Thank you.
Re: want to edit my navigation bar menu be likes here
Posted: Wed Aug 10, 2016 9:50 pm
by viethemes
Are you using a custom theme or the default theme? I can make a custom code for that.
Re: want to edit my navigation bar menu be likes here
Posted: Wed Aug 10, 2016 10:43 pm
by HusseinGomaa
Thanks viethemes
I'm using default theme
Thanks
Re: want to edit my navigation bar menu be likes here
Posted: Thu Aug 11, 2016 1:25 am
by sarthakinfotech
hi
for changing the menu bar colour and other thing you may edit
catalog/view/theme/default/stylesheet/stylesheet.css
especially for menu background color and pattern things you may edit line no 194
#menu styles
Re: want to edit my navigation bar menu be likes here
Posted: Thu Aug 11, 2016 6:15 am
by HusseinGomaa
Thanks for your reply
Please tell me how to do that customization.
Thanks
Re: want to edit my navigation bar menu be likes here
Posted: Thu Aug 11, 2016 1:24 pm
by sarthakinfotech
hi
you may change
background-color value
and also may change the pattern image.
you should be familiar with css for that

Re: want to edit my navigation bar menu be likes here
Posted: Thu Aug 11, 2016 11:54 pm
by viethemes
To do that you can install my free extension
Custom CSS and add below code
Code: Select all
#menu .nav > li:not(:last-child) {
border-right: 1px solid #ddd;
padding-left: 10px;
padding-right: 10px;
}
Re: want to edit my navigation bar menu be likes here
Posted: Sun Dec 18, 2016 2:57 am
by abccorp
I have opencart V2.x and have successfully set up multiple sites. I am setting up a new site now, Freshmo.com. I am not a new user but I can't seem to change the menu bar color. I have edited catalog/view/theme/default/stylesheet/stylesheet.css but see no change.
/* menu */
#menu {
background-color: #229ac8;
background-image: linear-gradient(to bottom, #23a1d1, #1f90bb);
background-repeat: repeat-x;
border-color: #1f90bb #1f90bb #145e7a;
min-height: 40px;
I have changed #229ac8 to other color codes but the color doesn't change. I've cleared the history and cleaned the cache and been patient overnight but I cannot change the menu bar background color.
I have changed the full page background color successfully by editing
catalog/view/theme/default/stylesheet/stylesheet.css, so I can't understand why I am having such difficulties changing colors when I know where the code is that needs to be changed.
I have tried changing #229ac8 to #7AD7AA throughout the whole stylesheet (that's seven different places) and still, there were no changes to page.
I really need some help here but I am not sure where. Please lend a hand.
Re: want to edit my navigation bar menu be likes here
Posted: Mon Feb 06, 2017 6:01 am
by Gobbo
Hi,
I've just updated the menu background, but how where do I update the menu text colour in the stylesheet.css?
Re: want to edit my navigation bar menu be likes here
Posted: Tue Feb 07, 2017 1:45 am
by cyclops12
Gobbo wrote:Hi,
I've just updated the menu background, but how where do I update the menu text colour in the stylesheet.css?
Search for
Code: Select all
#menu .nav > li > a {
color: #fff;
Re: want to edit my navigation bar menu be likes here
Posted: Tue Feb 07, 2017 1:48 am
by cyclops12
abccorp wrote:I have opencart V2.x and have successfully set up multiple sites. I am setting up a new site now, Freshmo.com. I am not a new user but I can't seem to change the menu bar color. I have edited catalog/view/theme/default/stylesheet/stylesheet.css but see no change.
/* menu */
#menu {
background-color: #229ac8;
background-image: linear-gradient(to bottom, #23a1d1, #1f90bb);
background-repeat: repeat-x;
border-color: #1f90bb #1f90bb #145e7a;
min-height: 40px;
I have changed #229ac8 to other color codes but the color doesn't change. I've cleared the history and cleaned the cache and been patient overnight but I cannot change the menu bar background color.
I have changed the full page background color successfully by editing
catalog/view/theme/default/stylesheet/stylesheet.css, so I can't understand why I am having such difficulties changing colors when I know where the code is that needs to be changed.
I have tried changing #229ac8 to #7AD7AA throughout the whole stylesheet (that's seven different places) and still, there were no changes to page.
I really need some help here but I am not sure where. Please lend a hand.
Is there any caching system on your hosting ?
Re: want to edit my navigation bar menu be likes here
Posted: Tue Feb 07, 2017 2:06 am
by Gobbo
Thanks Cyclops12, works perfectly.
Re: want to edit my navigation bar menu be likes here
Posted: Tue Feb 07, 2017 3:14 am
by cyclops12
Gobbo wrote:Thanks Cyclops12, works perfectly.
Glad to be of help

Re: want to edit my navigation bar menu be likes here
Posted: Fri Aug 18, 2017 3:52 am
by robocop1953
So can you share with the rest of us how you were able to solve the problem of trying to change the colour of the navigation menu bar? Thanks.
Re: want to edit my navigation bar menu be likes here
Posted: Tue Sep 19, 2017 12:07 am
by Michiel_M
robocop1953 wrote: ↑Fri Aug 18, 2017 3:52 am
So can you share with the rest of us how you were able to solve the problem of trying to change the colour of the navigation menu bar? Thanks.
Here's how I do it:
After doing all the changes in the stylesheet, I
empty the shops cache.
I go with FTP to the system's cache folder and delete all files EXCEPT index.html.
Refresh your browser and admire the changes in the new styling

My cache (OC version 2.3.0.2) is located at system/storage/cache