April 21, 2013 at 5:45 pm #22288
I have images that are the same size as the theme demo. Where in the control panel do I go to add the the images to menu above the links?
For example, on the demo site under shop there is this image: http://www.kriesi.at/themes/replete/files/2012/11/cool.jpg
Where do I go to edit that in my theme?
Thanks!April 22, 2013 at 1:17 am #115273
1.) Go to Appearance > Menu Editor.
2.) Add a new menu item and name it Mega Menu for example. Tick the “Use as Mega Menu” option.
3.) Add another menu item drag it slightly to the right of the menu item above it (Mega Menu) to create a hierarchy (parent/child) relationship in the menu, name it Column 1. Notice how it change the description to “Column”. Tick the “This column should start a new row” option and replace the label with a “-” sign.
4.) Add another menu item and drag it slightly to the right of the menu item above (Column 1). On the description you can embed the image, like this,
<img src="http://www.kriesi.at/themes/replete/files/2012/11/cool.jpg" title="" alt="" />.You need to check the “Use the description to create a Text Block. Dont display this item as a link. (note: dont remove the label text, otherwise wordpress will delete the item)” option.
5.) Save changes.
IsmaelAugust 28, 2013 at 2:41 pm #115274
I followed all your steps to achieve the menu replete/woman (4 small images displayed in the mega menu e.g. http://www.kriesi.at/themes/replete/files/2011/02/blog3-446×218.jpg) . It worked almost! Nice enough to show my client, but the ‘horizontal line’ is missing and the spacing is also not correct. Could you please help me to get it right?
The work in progress: http://dev.mimoa.co.za (password: hoffman)
and the mega menu is DIVISIONS.
Secondly, in the footer the 3 headings of the columns are in 2 colours (Contact Us, Let us know what you think) How can I fix this please?
Thanks so much for your help. Your Mega Menu tutorial above is very good!
capuchinAugust 29, 2013 at 1:50 pm #115275
If you want the horizontal line you need to start a new row for the images. Just expand the top level menu item where the images are and click on the check box for “This column should start a new row”.
Your menu structure would then be:
column with header | column with header | column with header | column with header
Then you add another menu item with a – for the title which clears it out and select the start a new row check box. The next sub items are each going to just be descriptions with the html for the images inside of them and – for the titles.
The topic ‘How to add images to mega menu like in the example?’ is closed to new replies.