Return to previous page

Header and menu css questions - by giannamateria

This topic has 5 replies, 3 voices, and was last updated 9 years, 8 months ago ago by Robert Hall

giannamateria

Participant

July 16, 2014 at 13:05

Hello again,I have some questions about the header and the menu.

1)I want to have the main menu containing only product categories and all other general pages like “home”,”news”,”contact” etc to be positioned on the top right.How can i add some page links on the top of the header(on the right)?i want it to look like the links you have on your last header https://dl.dropboxusercontent.com/u/8055763/legenda%20header.JPG ,the ones i marked with blue,but on the opposite side.
And in case this is possible,how can i change the font to bold,the font size and the whole top line background color?

2)Can i change the style of the fullwidth submenu that expands when you click on a menu element?I think it’s a bit confusing because its all white.It would be great if i could change any of these:
-put colored border or change background color on the expanded submenu
-change the background color of the menu element when clicked to open the submenu
You can see how it looks like now when for example i click on “ΔΟΜΙΚΑ ΥΛΙΚΑ” in this link https://dl.dropboxusercontent.com/u/8055763/open%20menu.JPG

3)As you can see in my header https://dl.dropboxusercontent.com/u/8055763/open%20menu.JPG
the category titles are in a differnet more classic font(theme’s default font i guess) than the subcategories,how can i change it?Also can i change the subcategories font to be more bold?

4)Last question,can i change the color of the background where the logo is placed in the header?

Thanks in advance!
Gianna

#9991 Copied

4 Answers

giannamateria

Participant

July 16, 2014 at 13:15

I forgot to write my site url is http://www.materia.gr

#9993 Copied
Eva Kemp

Support staff

July 16, 2014 at 13:52
Hello,

1. To create page links in the top header area you can use Text widget with the code of your links in “Place in header top bar” widget area in Appearance > Widgets. All customizations concerning styles can be done in custom.css file

2. You can change background color of the dropdown submenu adding this code into custom.css:
```
.main-nav .menu > li .nav-sublist-dropdown {
    background-color: #FFF !important;
}
```
Change the color value to yours.

3. To make font bold and subcategories font title the same as for main menu items please add the code into custom.css:
```
.main-nav .menu > li.menu-full-width .nav-sublist-dropdown .container > ul > li a {
    font-weight: bold; 
   font-family: helvetica;}
```
4. You can change background color of the header with this code:
```
div.header-wrapper.header-type-7 {background: #FFF;}
.main-nav {
    background: #FFF;
} 
```
Change the color value for “div.header-wrapper.header-type-7” to yours.

Regards,
Eva Kemp.
#9994 Copied
giannamateria

Participant

September 11, 2014 at 06:40

Sorry for late answering!Thanks these worked just fine! 🙂

#14940 Copied

Robert Hall

Support staff

September 11, 2014 at 06:45

Hello,

You’re welcome!
If you have any questions don’t hesitate to contact us.

Regards,
Robert Hall.

#14942 Copied
Tagged: header, menu, questions, template, woocommerce, wordpress
Viewing 5 results - 1 through 5 (of 5 total)