Drop down menu with images

This topic has 7 replies, 2 voices, and was last updated 7 years, 10 months ago by Artem Temos.

Viewing 8 posts - 1 through 8 (of 8 total)

Author

Posts
June 3, 2016 at 7:00 pm #1187

Chicology
Participant

Hello,

I was wondering, how did you create the drop down menu similar the one shown on your
demo page. Attached is a screenshot of what I mean .

http://www.chicology.com/tmp/screenshot_drop_down_menu1.png
http://www.chicology.com/tmp/screenshot_drop_down_menu_categories.png

I been searching the forum and followed the documentation on how to create a menu. But I couldn’t get it to look similar to the one show on demo. Please advise.

Thanks

June 3, 2016 at 10:04 pm #1190

Artem Temos
Keymaster

Hello,

Thank you for the question.

To create “Mega menu” dropdown you need to create a new HTML block in admin panel with Visual Composer (to enable VC for this post type you need to go to Visual Composer -> Role Manager -> Post Types and choose custom then select all post types). You can set it’s layout as you wish. Here is some example from our demo https://docs.google.com/document/d/1n5NuC2NhENQ6FygLzlyAmDz6nTiFH2ryrQ-4ZjfoRYw/edit?usp=sharing
After that you just copy this block’s shortcode (ex.: [html_block id="20396"]), go to Appearance -> Menus and paste it to the desired menu item’s description field. Also change it’s design to “Set sizes” and change dropdown sizes. Check the screenshot

June 6, 2016 at 4:31 am #1203

Chicology
Participant

I followed the instruction that you mention, however, under appearance > Menus, I don’t
see a description field available for the short code to be place.

June 6, 2016 at 3:51 pm #1205

Artem Temos
Keymaster

You just need to check “Description” field to be visible in wordpress “Screen Options” in the right top corner on this page.

June 7, 2016 at 11:55 pm #1214

Chicology
Participant

So I got the drop down menu to work by adding a short code from the html block I created
it somehow populated the drop down menu by the default menu template I assume .
See link : http://www.chicology.com/tmp/screenShot_Drop_Down_Menu.png

however, I am still having trouble getting menu to look like this link :
http://www.chicology.com/tmp/screenshot_drop_down_menu1.png

Also, I am not sure what to do with the code from this link https://docs.google.com/document/d/1n5NuC2NhENQ6FygLzlyAmDz6nTiFH2ryrQ-4ZjfoRYw/edit?usp=sharing

June 8, 2016 at 5:34 am #1215

Artem Temos
Keymaster

Hello,

Just copy the code from google document and place it as a source code for your HTML block. Then just do the same as you already done with other menu drop down.

June 9, 2016 at 4:01 pm #1221

Chicology
Participant

Ok, I got it to work, thank you.

June 9, 2016 at 4:41 pm #1225

Artem Temos
Keymaster

You are welcome, write us when you have any difficulties or issues with our theme.

And we would be glad if you will rate our theme with 5 stars on themeforest in case you are satisfied with our theme and customer service http://themeforest.net/downloads

Thank you in advance 🙂
Author

Posts