Post by HusseinGomaa » Wed Aug 10, 2016 9:00 pm

Hi everybody,

I have opencart v2.2 and I want to edit my navigation bar menu be likes here.
Image

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.

Newbie

Posts

Joined
Wed Aug 10, 2016 8:38 pm

Post by viethemes » Wed Aug 10, 2016 9:50 pm

Are you using a custom theme or the default theme? I can make a custom code for that.

http://www.viethemes.com - OpenCart turtorials, news, tips and stricks, extension

Our extensions:
Visual Theme Editor - Powerful tool for customizing style of any theme visually
Live Theme Editor - Customize layout, colors, backgrounds, fonts of the default theme
Theme Animation - Animation Editor for any theme

Extra Positions PRO, Custom JavaScript, Custom CSS and others


User avatar
Active Member

Posts

Joined
Thu Jan 08, 2015 12:17 pm


Post by HusseinGomaa » Wed Aug 10, 2016 10:43 pm

Thanks viethemes

I'm using default theme

Thanks

Newbie

Posts

Joined
Wed Aug 10, 2016 8:38 pm

Post by sarthakinfotech » Thu Aug 11, 2016 1:25 am

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

Good Day,
Jagruti
opencart tips and tricks ,
opencart blogs , opencart extensions/themes , custom development.


User avatar
Active Member

Posts

Joined
Tue Aug 05, 2014 1:12 am
Location - india

Post by HusseinGomaa » Thu Aug 11, 2016 6:15 am

Thanks for your reply

Please tell me how to do that customization.

Thanks

Newbie

Posts

Joined
Wed Aug 10, 2016 8:38 pm

Post by sarthakinfotech » Thu Aug 11, 2016 1:24 pm

hi
you may change
background-color value

and also may change the pattern image.

you should be familiar with css for that :)

Good Day,
Jagruti
opencart tips and tricks ,
opencart blogs , opencart extensions/themes , custom development.


User avatar
Active Member

Posts

Joined
Tue Aug 05, 2014 1:12 am
Location - india

Post by viethemes » Thu Aug 11, 2016 11:54 pm

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;
}

http://www.viethemes.com - OpenCart turtorials, news, tips and stricks, extension

Our extensions:
Visual Theme Editor - Powerful tool for customizing style of any theme visually
Live Theme Editor - Customize layout, colors, backgrounds, fonts of the default theme
Theme Animation - Animation Editor for any theme

Extra Positions PRO, Custom JavaScript, Custom CSS and others


User avatar
Active Member

Posts

Joined
Thu Jan 08, 2015 12:17 pm


Post by abccorp » Sun Dec 18, 2016 2:57 am

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.

Newbie

Posts

Joined
Sun Dec 18, 2016 2:49 am

Post by Gobbo » Mon Feb 06, 2017 6:01 am

Hi,

I've just updated the menu background, but how where do I update the menu text colour in the stylesheet.css?

Using opencart 3.0.3.2 - PHP 7.4 - Standard Template - Add to Cart Enable Disable Out of Stock Product 3.x - Export/Import Tool (V3.22) for OpenCart 3.x - Footer Social Media Link( 3.x ) v1.0


Active Member

Posts

Joined
Tue Jun 22, 2010 12:38 am

Post by cyclops12 » Tue Feb 07, 2017 1:45 am

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;

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by cyclops12 » Tue Feb 07, 2017 1:48 am

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 ?

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by Gobbo » Tue Feb 07, 2017 2:06 am

Thanks Cyclops12, works perfectly.

Using opencart 3.0.3.2 - PHP 7.4 - Standard Template - Add to Cart Enable Disable Out of Stock Product 3.x - Export/Import Tool (V3.22) for OpenCart 3.x - Footer Social Media Link( 3.x ) v1.0


Active Member

Posts

Joined
Tue Jun 22, 2010 12:38 am

Post by cyclops12 » Tue Feb 07, 2017 3:14 am

Gobbo wrote:Thanks Cyclops12, works perfectly.
Glad to be of help :)

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by robocop1953 » 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.

Active Member

Posts

Joined
Wed Jul 17, 2013 2:18 am

Post by Michiel_M » Tue Sep 19, 2017 12:07 am

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

Newbie

Posts

Joined
Mon Sep 18, 2017 7:31 pm
Who is online

Users browsing this forum: No registered users and 58 guests