background colour

**GK User** Wed Nov 28, 2012 6:39 pm

hello,

how can i make the blue background only on the side and leave the header as white back ground

http://maaku-ng.com/web/web/

**Konrad M** Wed Nov 28, 2012 8:37 pm

Hi,
please try add to override.css

Code: Select all: #gkPageTop,#gkHeader { background:#ffffff; }

and remember to enable override.css option in template settings.

**GK User** Thu Jan 03, 2013 8:45 pm

Hi Konrad
I'm looking to use ONE URL image as background to the gkPageTop area, and have the image continue covering below behind gkBanner2 AND the Breadcrumbs/font resizer area - so one image and background for these top sections. I'm thinking this isn't possible though...
thanks!

**Konrad M** Fri Jan 04, 2013 8:08 am

Well you can try add this image as background to <body> tag. Of course it has to be centered, has samw width as template width and items you mentioned have to have no background.

**GK User** Mon Jan 07, 2013 9:49 pm

That probably won't work as I'm hoping, so what if I want the main menu and submenu to have an image as background instead of grey, maybe define it little taller, like a banner size of 150px (width of template is 1000)?

If that can't work then, do image background for Breadcrumbs and Resizer instead, and increase the font size and area for those, and eliminate the margin below this so it's closer to the mainbody.

What would the css override be for that? I would need to play with font color too for the menu titles also... so include this in the override code.
Thanks!

**Konrad M** Tue Jan 08, 2013 12:40 pm

If you would like to have background for menu items please try add to override.css

Code: Select all: #gkPageTop { background:url("../images/your_image.jpg) bottom left no-repeat; }

and remember to copy your image to images folder located inside our template folder.
Here you have code for menu titles color. Just please add to override.css

Code: Select all: div.gk-menu > ul.level0 > li > a { color: #1B1F23; }

and set yout own color value. Please can you add some attach becasue I'm not sure If I understand about space and icrise font in Breadcrumb area.

**GK User** Tue Jan 08, 2013 7:31 pm

Hi Konrad,

I tried this in the css override (which is enabled), but it didn't work:

#gkPageTop {
background: url('../images/st_andrews1.jpg') bottom left no-repeat;
}

I tried a few variations per other forum posts, but none worked. The image is uploaded into the images folder... please let me know what I did wrong in the code. Thanks

https://www.golfsgreatheritage.com/

**Konrad M** Wed Jan 09, 2013 4:35 pm

I see that you are using css compresion. Remember to clear your cache after every changes you made in css files.

**GK User** Wed Jan 09, 2013 9:56 pm

Hi - realized I put the image in the wrong folder, so fixed.
Now looking to fix the 2 items noted on Screen Shot. Thanks!

**GK User** Wed Jan 09, 2013 10:05 pm

forgot the second screen shot...

**Konrad M** Fri Jan 11, 2013 1:19 pm

To make menu transparent please add to override.css

Code: Select all: #gkMainMenu > div.gk-menu > ul, #gkMainMenu > div.gk-menu > ul > li:hover, #gkMainMenu > div.gk-menu > ul > li:active, #gkMainMenu > div.gk-menu > ul > li:focus, #gkMainMenu > div.gk-menu > ul > li.active, #gkSubmenuMod { background:none !important; } #gkMainMenu, #gkMainMenu > div.gk-menu > ul, #gkMainMenu > div.gk-menu > ul > li > a, #gkMainMenu > div.gk-menu > ul > li { border:none !important; }

and to remove space please add:

Code: Select all: #gkMainMenu { margin: 42px 0 0 0; }

About second screen, to remove top white space please add to override.css

Code: Select all: #mainContent { padding: 34px 34px 0 34px; }

and decrease firs value to fit your needs. Font size buttons are images so you need to edit them or one of fonts from template settings. Let me know what would you like to do.

**GK User** Sat Jan 12, 2013 11:30 pm

Most excellent help! Thank you!
I need to override the submenu (see screen shot). thx

**GK User** Sat Jan 12, 2013 11:44 pm

...also... realized Breadcrumbs gets cutoff with 0px at top of maincontent. Wondering if I can keep this code the same, but css the breadcrumbs margin separately? Also, the Banner2 has a lot of margin, might like to play with margin on that module if you can provide override... thanks!

code I'm using is

#gkMainMenu {
margin: 80px 0px 60px 0px;
}

#mainContent {
padding: 0px 34px 0 34px;
}

**GK User** Sun Jan 13, 2013 1:37 am

was able to override the font on submenu with

#gkSubmenuMod ul li {
font-size: 16px;
}

#gkSubmenuMod ul li a{color:#000000}

, but not sure how to improve the alignment so that it matches the menu item on the left of about GolfsGreatHeritgage?

**Konrad M** Wed Jan 16, 2013 10:54 am

Did you fix it ? Becasue on website you have all menu item in one line.

**GK User** Wed Jan 16, 2013 6:27 pm

Hi Konrad - thanks for following up. I'll show remaining questions within the attached screen shots. Look forward to hearing your ideas! :idea:

**GK User** Wed Jan 16, 2013 6:28 pm

I had one more to post...

**Konrad M** Fri Jan 18, 2013 8:31 am

Ichecked it on my FF and it looks ok. Can you enable breadcrumb for me ? I will try fix it.

**GK User** Fri Jan 18, 2013 8:41 am

Hi Konrad - thanks -yes, just enabled breadcrumbs and font resizer in template.... look forward to the fix..

**Konrad M** Fri Jan 18, 2013 8:57 am

To fix breadcrumb please add to override.css

Code: Select all: #gkBreadcrumb { margin: 0 0 34px 0; }

and please give me url to this banner. I can't find it.

**GK User** Fri Jan 18, 2013 8:59 am

here is the url
https://www.golfsgreatheritage.com/inde ... golf-store

**GK User** Fri Jan 18, 2013 9:04 am

Breadcrums fix looks great!

**Konrad M** Fri Jan 18, 2013 9:06 am

Please add this to override.css:

Code: Select all: #gkBanner2, #gkBanner3,#gkBanner2 p, #gkBanner3 p { margin:0 !important; }

**GK User** Fri Jan 18, 2013 9:17 am

yes, just need to center it

**GK User** Fri Jan 18, 2013 9:18 am

btw - so your FF shows all on the same line above the submenu?

**Konrad M** Fri Jan 18, 2013 9:49 am

Yes, all are in one line.

**GK User** Fri Jan 18, 2013 6:19 pm

Thanks for the help on this - all is solved and looking great!

**GK User** Sat Jan 19, 2013 2:35 am

konrad - sorry but one more reach out on this... see the screen shot - I published font resizer and without breadcrumbs on the home page - but man, that's way too much white space! How to fix? thanks!

**Konrad M** Sat Jan 19, 2013 9:46 am

Please add to override.css

Code: Select all: #gkTop2 { margin-bottom: 34px; }

and reduce this value to fit your needs.