ATTENTION, PLEASE READ: New topic creation is disabled, as we have moved to a new support system. Your existing topics will remain, but for all new requests you will need to use the new system. Click here to go to the new support request form.

• Back to forum

  Posted in: Dante
• April 13, 2015 at 11:50 am #164678
  mikexavier

  Member

  Post count: 28

  I have been struggling to get images to display correctly in the mega menu. I have tried all different combinations of check boxes, html, width etc. but nothing seems to be working the way it should.

  There are examples under the shop (which works sometimes) and collections (which has never displayed correctly).

  The background seems to revert to the menu items size and not include the image?

  I’m also looking for a way to remove the vertical and horizontal lines and was told to check the ‘alternate menu’ box but this isn’t working for me.

  Thanks for your help!

  Mike

  April 15, 2015 at 8:20 am #165241
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Hi

  Check now

  – Kyle

  April 15, 2015 at 12:23 pm #165316
  mikexavier

  Member

  Post count: 28

  Thanks Kyle, it looks better but still not ideal… the spacing is much too large, there only really needs to be 10px padding around the image (or close to).

  I’m also not sure where the HTML is for the image itself as it’s no longer under the menu item.

  Could you run me through how you’ve done it?

  Thanks

  Mike

  April 15, 2015 at 12:54 pm #165318
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  This is the structure of mega menus: http://cardinal.swiftideas.com/documentation/wp-content/uploads/sites/35/2014/05/mega-menu-setup.jpg

  You had your image as the first child of the parent item, which is the column heading position. All I did was make it the second child.

  Can you let me know which spacing you are referring to?

  – Kyle

  April 15, 2015 at 10:39 pm #165478
  mikexavier

  Member

  Post count: 28

  Understood… please see attached screen grabs.

  1. The spacing goes far beyond the image size (as you can see). How do I ensure the spacing (or background) is only slightly larger than the content of the menu?

  2. As you can see from the screen grab, there is no HTML in the parent, first or second child position? Where is it?

  Thanks Kyle

  – Mike

  Attachments:

  You must be logged in to view attached files.
  April 16, 2015 at 12:08 pm #165634
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  That’s odd, will check now

  April 16, 2015 at 12:28 pm #165641
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Can you try use the image asset shortcode instead of HTML

  – Kyle

  April 17, 2015 at 7:16 am #165812
  mikexavier

  Member

  Post count: 28

  Hey Kyle, you’re going to have to explain a few things…

  1. Where do I find the image asset shortcode? (I have attached the image attachment details).

  2. Once I have the shortcode for that image, where is the HTML to replace? As I showed before, it doesn’t seem to exist. Although the image is still showing in the menu.

  Thanks

  Mike

  Attachments:

  You must be logged in to view attached files.
  April 17, 2015 at 8:37 am #165833
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  I’ve moved the menu items back to the first child, and the html section shows up again. However some divs are missing, that’s why I want you to try the image shortcode instead

  Create a new page, add the image page builder asset, switch to visual editor then copy the shortcode to put in your menu item

  – Kyle

  April 17, 2015 at 11:34 am #165952
  mikexavier

  Member

  Post count: 28

  It has reverted back to a one column background (no filling the size of the image).

  I used the correct structure for the “shop” menu item and have an image in there also which seems to work most of the time. Not sure why it’s behaving differently for the ‘collection’ menu item?

  Any other ideas?

  April 21, 2015 at 12:27 am #166639
  Rui Guerreiro – SUPPORT

  Keymaster

  Post count: 25779

  just forwarded the topic to Kyle so he can reply.

  -Rui

  April 26, 2015 at 9:23 pm #168786
  mikexavier

  Member

  Post count: 28

  Hey guys, any luck with this one?

  I have moved the staging site to go live tomorrow morning… the menu is still an issue that I would like to fix ASAP if possible.

  hiveswimwear.eu (and the menu in question is the “collections” one)

  Let me know if you have any other ideas 🙂

  thanks

  – Mike

  April 27, 2015 at 10:00 am #168939
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Add this to your custom css:

  nav.mega-menu li.sf-mega-menu-alt .sub li.menu-item-object-custom {
    padding: 20px;
  }

  – Kyle

  April 27, 2015 at 5:02 pm #169131
  mikexavier

  Member

  Post count: 28

  That gave it a little white space love around the image but for some reason the image is now a thumbnail? Ideally it would display as the original size? do you know how to achieve this?

  Cheers Kyle!

  April 28, 2015 at 11:43 am #169520
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Have you tried setting the mega menu column width?

  – Kyle

• Back to forum

  Posted in: Dante