Return to previous page

Menu Images - by jonarobinson - on WordPress WooCommerce support

This topic has 13 replies, 3 voices, and was last updated 8 years, 1 months ago ago by Eva Kemp

jonarobinson

Participant

October 11, 2016 at 13:57

Hi,

Just looking at your demo site, and I quite like the way your menu opens up with the text centered and the images below the text, see below for an example:

http://test.crossling.co.uk/wp-content/uploads/2016/10/Screen-Shot-2016-10-11-at-13.52.00.png

I am developing quite a large shop for a lot of catagories and I was hoping to put images like that onto mine to make it more pictorial, is there any documentation or anything I can follow as I cant seem to find it on my current documents for how to achieve a similiar menu? (with the text centered and the images underneath each link).

Thanks in advance.

John

#142294 Copied

12 Answers

Rose Tyler

Support staff

October 11, 2016 at 14:20

Hello,

You can add images into menu as described in the documentation:
https://www.8theme.com/demo/docs/woopress/#!/primary_menu

Regards,
Rose Tyler.

#142299 Copied

jonarobinson

Participant

October 11, 2016 at 16:38

Thanks for the reply.

When I try to place an image in, it randomly just appears in my menu, where as I would prefer it to be above or below the menu link:

See example:
http://test.crossling.co.uk/wp-content/uploads/2016/10/Screen-Shot-2016-10-11-at-16.36.47.png

How do I get it to display properly with the wording above or below the menu image.

Thanks,
John

#142324 Copied

Eva Kemp

Support staff

October 11, 2016 at 17:02

Hello,

You need also add class with-tooltip to submenu items in Appearance > Menus.
Please try it.

Regards,
Eva Kemp.

#142328 Copied

jonarobinson

Participant

October 12, 2016 at 09:12

Hello,

Yeah that worked!

However, the columns arent going into 5, they are breaking at 4 then dropping onto the next row which is making it look really spaced out.

For example:
http://test.crossling.co.uk/wp-content/uploads/2016/10/Screen-Shot-2016-10-12-at-09.09.04.png

How do i flatten it out to make it look like its all together?

Thanks

#142376 Copied

Eva Kemp

Support staff

October 12, 2016 at 09:37

Hello,

I’ve added the class “tooltip-wrap” for parent menu item. Please check it now.

Regards,
Eva Kemp.

#142377 Copied

jonarobinson

Participant

October 12, 2016 at 09:55

Yeah that works perfectly!

Whats a good pixel size for the images so they fit quite snug in that box? Also how did you get into my website admin login? should I be worried about my dashboard security? 😀

Once again, great help! hugely appreciate your work.

Thanks,
John

#142378 Copied

jonarobinson

Participant

October 12, 2016 at 11:10

I continued doing this for all my shop menus,

the next one I did I got the following outcome:

http://test.crossling.co.uk/wp-content/uploads/2016/10/Screen-Shot-2016-10-12-at-11.06.13.png

How do I get it aligned properly again? 🙁

Or maybe can I scale the whole drop down so it appears smaller on my screen?

Thanks,
John

#142397 Copied

Eva Kemp

Support staff

October 12, 2016 at 11:47

Hello,

You added admin credentials in previous topics.

On our demo we used images with sizes 209px × 120px.

You didn’t add CSS class for all sub items http://storage3.static.itmages.com/i/16/1012/h_1476269259_7611232_0f1771d3a4.jpeg
Please check all items.

Regards,
Eva Kemp.

#142404 Copied

jonarobinson

Participant

October 12, 2016 at 12:07

Amazing, thank you!

Feel quite silly now it was that easy of a fix.

I know im being a pain, how would I go about increasing the border thickness / colour of the dropdown box just so it stands out abit more from the page behind it?

Really sorry for all the questions, youve been great help so far.

Thanks again,
John

#142410 Copied
Eva Kemp

Support staff

October 12, 2016 at 12:54
Hello,

Please use this code in Theme Options > Custom CSS > Global Custom CSS:
```
.header-type-6 .menu-wrapper .menu-main-container > ul .nav-sublist-dropdown {
    border: 2px solid blue;
}
```
Regards,
Eva Kemp.
#142414 Copied
jonarobinson

Participant

October 12, 2016 at 14:01

Perfect,

Great help!!

You deserve a pay rise.

Thanks,
John

#142438 Copied

Eva Kemp

Support staff

October 12, 2016 at 14:06

Hello,

Thank you!
Please leave a review on TF site https://themeforest.net/item/woopress-responsive-ecommerce-wordpress-theme/reviews/9751050

We appreciate it very much!

Regards,
Eva Kemp.

#142440 Copied
Viewing 13 results - 1 through 13 (of 13 total)