Return to previous page

Menu image sub item - by nabilahshukri - on WordPress WooCommerce support

This topic has 4 replies, 2 voices, and was last updated 9 years, 10 months ago ago by Eva Kemp

nabilahshukri

Member

January 3, 2015 at 00:13

Hi, several issues with my main menu,

1) In ‘shop’ item in my main menu, I have 3 different sub items. they were displaying well. However when I change the 3 sub items to images, the sub items to those sub item does not show any more, rather just arrows and not even aligning in proper column.

2) One of the sub menu with in have lots of sub-menu of itself which is very long. How do I break them to make a second column. I did it manually my adding the same sub-item menu a second time, but I am sure there’s a more clever way to do this.

3) How to make the full-width menu not totally full width, maybe minus a few inches from the sides.

4) How to make the background of the drop down menu have some transparency like in the demo for cars page.

Also on a different topic, I am trying to make the header logo bigger, i.e near its original size. I use this css (as read in the forum):

.header-logo img {
max-width: 400px !important;
max-height: 80px !important;
}

but the logo header still small. how to make it bigger?

Thanks

Please, contact administrator
for this information.

#31789 Copied

3 Answers
Eva Kemp

Support staff

January 3, 2015 at 16:38
Hello,

1. To add images as a submenu item you need add it as a last item:
https://www.8theme.com/demo/docs/legenda/index.html#!/primary_menu > Menu images
2. To divide submenu into columns view our documentation: https://www.8theme.com/demo/docs/legenda/index.html#!/primary_menu > Colums in menu
3. Please read the documentation: https://www.8theme.com/demo/docs/legenda/index.html#!/primary_menu > Menu types
4. Please add this code into custom.css file:
```
.main-nav .menu > li .nav-sublist-dropdown {
    background-color: rgba(255, 255, 255, 0.95);
}
```
5. To change logo size add this code in custom.css file:
```
.header7 .logo img {
    max-width: 500px;
}
```
Thank you.
Regards,
Eva Kemp.
#31830 Copied
nabilahshukri

Member

January 4, 2015 at 01:10

Hi, numbering below based on my question and your answer:

1) so basically I can’t do the menu image unless its the last level of the menu. okay I just stick to words then.

2) i did read the manual, but it just say to use et-co1-1 to et-col12. I didn’t give description what it meant and how to edit it. i tried to use it but nothing changed.

3) again, the manual didn’t specify how to do this, it says the css option available is only menu-full-width or menu-full-width open-by-click, which is neither what I wanted.

4) i cut and paste the code you gave but it still doesn’t give any transparency. even tried to change the values but nothing change. even tried adding the !important word but nothing changed too.

5) thanks, this has now worked.

#31868 Copied
Eva Kemp

Support staff

January 5, 2015 at 10:47
Hello,

1. Yes, you’re correct.
2. Sorry for misunderstanding. There are no features to divide a submenu into columns.
3. To make submenu items to be spread you need use et-co1-1 to et-col12 in CSS classes of the menu.
4. I’ve added this code into custom.css file to make submenu transparent:
```
.main-nav .menu > li.menu-full-width .nav-sublist-dropdown, .main-nav .menu > li .nav-sublist-dropdown .container, .fixed-header .menu > li.menu-full-width .nav-sublist-dropdown {
    background-color: rgba(255, 255, 255, 0.5) !important;
}
.main-nav .menu > li .nav-sublist-dropdown .container > ul > li a, .fixed-header .menu > li .nav-sublist-dropdown .container, .fixed-header .menu > li .nav-sublist-dropdown .container > ul > li a {
    background-color: transparent !important;
    color: black !important;
}
.main-nav .menu > li.menu-full-width .nav-sublist-dropdown .container > ul > li > a, .fixed-header .menu > li.menu-full-width .nav-sublist-dropdown .container > ul > li > a {
    color: black !important;
}
```
Please check.

Regards,
Eva Kemp.
#31929 Copied
Tagged: image, menu, persuasive, sub item, themes, woocommerce, wordpress
Viewing 4 results - 1 through 4 (of 4 total)