Return to previous page

Drop-Down Menu kind of messed up - by Danilo

This topic has 4 replies, 2 voices, and was last updated 9 years, 4 months ago ago by Jack Richardson

Danilo

Participant

August 3, 2015 at 22:02

Hey there,
I wanted to edit the dropdown-menu of my site a bit.

This is my desired look:

I like the way to have headings (which are not clickable) so sort your menu.

Instead on my site it looks like this:

Is there a way to make it look better? It is kind of messed up, I’d love to have it all sorted (same spaces etc).
Here is what I tried so far:
I activated Description and CSS-Classes in the Options of the Menu.
On the “Shop” Page in the Primary Menu Settings I added the CSS-Class “menu-full-width”.
On the Sub-Items (i.e. my Product-Categories) I added the CSS-Class “et-col1″/”et-col2” – but none does the job, so I stick with no CSS-Classes on the Sub-Items (which looks better, but not perfect).

Would be more than happy with any help!

Kind regards,

Danilo

#78376 Copied Theme version: 2.6.3 WooCommerce version: 2.3.11

3 Answers

Jack Richardson

Support staff

August 4, 2015 at 07:24

Hello,

Unfortunately menu can’t be edited the way you want, but I’ve modified it a bit. Please check it now. You can change width of submenu columns using css classes from et-col1 to et-col12. I’ve set the width to et-col2.

Best regards,
Jack Richardson.

#78397 Copied

Danilo

Participant

August 4, 2015 at 12:38

Hey Jack, thanks for that!
Actually, your idea made me think of something and now it is working just fine! 🙂
It now looks like this:

I just created a custom link-element in the menu. The URL was set to “#”.
Then I simply re-arranged everything, set the colums-width and I was good to go.

Jack, is there a way to define my own CSS-Classes?
This way, I could just add “font-weight: bold” to that class and apply it to the “Headings” in my Drop Down Menu and I should be just fine.

Greetings and thanks again!

Danilo

#78464 Copied

Jack Richardson

Support staff

August 4, 2015 at 13:07

Hello,

Yes, you can write your own css classes for menu items. For example, if you added the class for menu item width “et-col2”, you can write other class beside it and it will be et-col2 my_class.
Please try it.

Best regards,
Jack Richardson.

#78467 Copied
Tagged: drop down, menu, messed up, templates, woocommerce, wordpress
Viewing 4 results - 1 through 4 (of 4 total)