AbanteCart Community

Shopping Cart Operations => Tips and Tricks => Topic started by: Old Fossil on April 26, 2014, 06:04:20 PM

Title: Changing the Menu Colour
Post by: Old Fossil on April 26, 2014, 06:04:20 PM
if you want to change the colour of the menu this will help.

On your cpanel go into the following files.

public_html/storefront/view/default_html5/stylesheet/style.css


Look for the following and change the section I have shown in bold to the colour of your choice. You can do this either as text ie red or as the Hex code.

/* ------------ Header ------------ */
.headerstrip {
   height: 72px;
   background-color: 00a1cb;
}
/*
Title: Re: Changing the Menu Colour
Post by: Advisor on May 04, 2014, 08:03:21 AM
Thanks a lot... I was looking for that  ;)
Title: Re: Changing the Menu Colour
Post by: narf on August 12, 2014, 09:03:42 PM
thanks for the help!  8)
Title: Re: Changing the Menu Colour
Post by: bubblegumweb on October 20, 2014, 06:38:06 PM
Thanks for that, I have managed to change the header color, but when I get the logo to have the same color there is always a small gap top and bottom that is still white, and no matter how I change the code in the css file it still does not fit exactly into the header, any ideas?
Regards
Title: Re: Changing the Menu Colour
Post by: llegrand on October 20, 2014, 07:02:34 PM

Perhaps your logo is a smidge too short -  the white opening is 300 x 72  try making your logo that size.

I have a larger header space on some sites and match the header height and the logo size and it seems to work well.  It's 110 px height and I make my logos 375X110.

You can see one here:http://countrysnackbucket.com (http://countrysnackbucket.com)

Hope this helps you out. 
Lee


Title: Re: Changing the Menu Colour
Post by: Richard on November 16, 2014, 09:52:48 PM
Hi Lee ,

I would like to ask how do you apply shadow to the main banner ? I have highlighted the area in red as below attachment. Thanks

Richard
Title: Re: Changing the Menu Colour
Post by: llegrand on November 16, 2014, 11:58:13 PM
I add the box-shadow: line   -  Note,  this one has also a change in the height of the headerstrip as my logos are bigger.


* ------------ Header ------------ */
.headerstrip {
    height: 110px;
    background-color: #7C2418;
    box-shadow: 0px 10px 5px #888888;

Lee
Title: Re: Changing the Menu Colour
Post by: Richard on November 17, 2014, 02:23:16 AM
Thanks Lee
Title: Re: Changing the Menu Colour
Post by: MRCC on November 30, 2014, 09:24:31 PM
I modified the style sheet as you indicated, but still have this blue color (11558f) menus and cheesy orange-red (a02a26) block titles from the original installation. I would like to change a couple of the default block titles and text colors, and remove/modify the secondary menus.

I have searched every style sheet, the store database, and the code for the entire site (using Dreamweaver), but I cannot find how to change the menu color or these other items.
Title: Re: Changing the Menu Colour
Post by: yonghan on November 30, 2014, 10:40:44 PM
Hi MRCC,welcome aboard.
1. Please make sure that you have cleared the cache after you edit the css file.you can find it under settings-cache on admin page,check all of it and then click the clear cache button.You can search on this forum too about clearing cache.

2. Please try using firefox addon called firebug to check the element style and location for the element you want to modify.

Hope it helps.
Title: Re: Changing the Menu Colour
Post by: llegrand on December 01, 2014, 12:41:59 AM
http://css-color-replace.orca-multimedia.de/ (http://css-color-replace.orca-multimedia.de/)
This posting was for changing the header strip color,  which was the original inquiry. But as you are requesting additional areas of change I will respond here.  But as a newbie,  please try to follow the board standards of one issue to a posting.  It does help for clarity and searching.

Perhaps using this for the stylesheet  global changes will get you where you want to go quicker.

Simply upload your stylesheet.css file -  pick the colors you find less objectionable and it will render the changes to the entire style sheet.
then download the changed file and upload the new stylesheet to your files thereby replacing the existing one.

Or perhaps using dreamweaver you could search for your offending colors?

Lee

PS and as Handoyo said -  welcome.
Title: Re: Changing the Menu Colour
Post by: ronybarne on March 05, 2015, 06:53:02 AM
That's nice! People with no knowledge about coding can also avail help from this. Thanks for sharing! :)
Title: Re: Changing the Menu Colour
Post by: mykidz on March 07, 2015, 05:50:15 AM
Hi! Thanks for sharing. I already managed to change the top menu color. But the "HOME" button, "ADD TO THE CART" button still in blue color. How do I change it? I wish to change them same like the top menu button color. TQ in advance.
Title: Re: Changing the Menu Colour
Post by: Basara on March 09, 2015, 01:36:04 AM
Hello

Please check css to change styles. I suggest you use a browser debugger, like Firebug in Firefox. This will help you inspect what to modify and where to change css.
Title: Re: Changing the Menu Colour
Post by: ronybarne on March 11, 2015, 07:56:17 AM
That's great! Will definitely try to change it with CSS. Can I work on Chrome?
Title: Re: Changing the Menu Colour
Post by: Basara on March 11, 2015, 08:42:42 AM
That's great! Will definitely try to change it with CSS. Can I work on Chrome?

You can inspect css in Chrome too
Title: Re: Changing the Menu Colour
Post by: ronybarne on March 17, 2015, 07:33:59 AM
Oh that’s nice! Thanks!
Title: Re: Changing the Menu Colour
Post by: Advisor on May 18, 2015, 01:46:33 PM
This works nicely with CSS3 too  ;)
Title: Re: Changing the Menu Colour
Post by: Advisor on May 18, 2015, 02:22:35 PM
That's great! Will definitely try to change it with CSS. Can I work on Chrome?
Even better : try Opera's build in debugger
Title: Re: Changing the Menu Colour
Post by: AlexGraphicD on May 23, 2015, 07:27:39 AM
Hi. I'd like to ask how can I edit the contact page so I can add a google map?
Title: Re: Changing the Menu Colour
Post by: llegrand on May 23, 2015, 08:25:53 AM
Hi,   probably would be better if you posted a NEW topic for a different type of question -  makes the search more relevant for others.

If you are asking about making a content page with a google map that you could out a link to and also it shows in the footer area  you can easily add pages   in Design > Content   there is an editor box an you can add an Google map there easily.

Here's the docs with more details:

http://www.abantecart.com/ecommerce-documentation/admin-user-manual/design/content-manager (http://www.abantecart.com/ecommerce-documentation/admin-user-manual/design/content-manager)