In this article you will learn how to add, hide, delete and rearrange menu items. Menu items are your website's navigation, and the primary way your customers will find what they are looking for. To get started login to your site's Admin.


Once you're logged in:

  1. Navigate to Content > Menu Items


First you will need to determine whether you have a Static menu or a Mega menu. The easiest way to determine this is:

  • Static: The first menu will be called 'Main Default'.
  • Mega: The first menu will be called 'Main Mega Menu'. 

Static Menus


To add a new menu item:

  1. Click "Add" then "Menu Item" in the top-right of this page.
  2. In the "Name" field put what you want the menu item to be, ex: "Engagement" or "About Us"
  3. The slug field will auto-populate, leave it be.
  4. Assign a "Page Link" or paste a link into the "Web Link" field*, not both.
    *Note: If still in development, do not put a full dev site URL into the Web Link field. Instead only put everything after the ".com" including the first forward slash ('/').
  5. The "Target" should remain the default of "Opens in Same Window" unless you are linking to a third-party website, in which case we recommend you change it to "Opens in New Window".
  6. The "Position" and "Relative To" drop-downs determine where your menu item lives in relation to all the other menu items.


Fields commonly left blank/unaltered when creating a menu item: Status, Status changed, Description, Icon, CSS Class. Do not worry about putting something in these fields.


To hide a menu item you may want to use at a later date:

  1. Click on the menu item
  2. From the "Status" drop-down select "inactive" and click "Save"

To delete a menu item that you'll never want to use again:

  1. On the Menu Items landing page, check the box next to the menu item you wish to delete.
  2. From the "Action" dropdown select "Delete selected menu items" and click "Apply".


To rearrange menu items you have two options:

Learn more about the "Parent/Child Relationship" as it pertains to menu items and the following instruction.



Option 1

  1. On the Menu Items landing page, click + hold the three horizontal bars next to the delete check-box, then drag the menu item above or below the menu item you want it to live next to. Release the hold on the menu item when you see a thin purple line exactly where you want the menu item to live. This is an auto-save - you do not need to click "Save" anywhere. This option will look like the following screenshot:

    If you see a thick purple bar, this means you are moving the menu item to be a Child of whatever menu item is highlighted in purple. Again, an auto-save.
    Do not put a Child under a Child. This means your navigation is three levels deep and this is not recommended. Parents and Children. Not: Grandparents, Parents and Children. Capiche? :)

Option 2

  1. On the Menu Items landing page, click the name of the menu item you wish to move. Use the "Position" and "Relative to" drop-downs at the bottom of the menu item to designate where the menu item should live.
    Position
            "First Child Of" - use this if the menu item you are editing will be the first menu item to live under another.
            "Before" - use this if the menu item you are editing should come before another (you will choose the other menu item in the next drop-down).
            "After" - use this if the menu item you are editing should come after another (you will choose the other menu item in the next drop-down).

    Relative To
            Select the menu item you want the one you're currently editing, to come before, after, or the become the first child of.





Mega Menus (MM)
What Are Mega Menus?


Every website comes with a pre-made Mega Menu. If you don't have one or aren't sure, email support@thinkspacehq.com. It is safe to say the pre-made Mega Menu will cover about 50% of your bases if you don't make any modifications to the Main Mega Menu before implementing it. Generally speaking, you could make the switch and have about an hour's worth of work to make the menu 100% applicable to your business. If you do this, a good time time of day would be the late evening when website traffic is low. Alternatively you could build out the MM to the best of your ability/knowledge and then make the switch. This is the recommended route to go. Get the menu as close as possible and then turn it on. This route will not allow you to see changes as you make them on the front-end of the website, though. 


If you choose to make the switch from a Static Menu to a Mega Menu or vice versa on your own, all you will need to do is change the slug in each main menu item. They are "Main Default" and "Main Mega Menu". Whichever menu type you choose, 'main' must be the text in the "Slug" field to indicate this is the menu you want. The website will show whichever menu has 'main' in the slug. The menu you do not choose can have anything but 'main' as the slug.


There are two pieces to a Mega Menu (MM) on your website:

  1. Menu items
  2. Menu item widgets*
    *You cannot add a MM item without first having created the MM widget.

To edit a MM widget:

  1. Navigate to Content > Mega Menu Widgets
  2. Click on the widget you want to edit
  3. Click "Edit widget options"
  4. Make any edits you need
  5. Click "Save Changes"
  6. Click "Close"
  7. Click "Save"

To add a new MM item:

  1. Navigate to Content > Menu Items
  2. From the "Add" button drop-down top-right of the page, select "Mega Menu Item"
    The process from here is similar to a regular menu item except you'll choose which Mega Menu Widget should be tied to this menu item.
  3. From the "Mega Menu Widget" drop-down choose the widget you want to show in this section of your Mega Menu
  4. From the "Widget columns" drop-down choose how much space you want this section to take up in the drop-down on the front-end.
    You have 12 columns to work with total per drop-down. Your average mega menu widget needs at least three columns ("3 (25%)"). Do not exceed twelve columns.

To connect a MM widget to a pre-existing MM menu item*:

*You must have already created the widget.

  1. Navigate to Content > Menu Items
  2. Click on the Menu Item you wish to update
  3. From the "Mega Menu Widget" drop-down choose the widget you want to show in this section of your Mega Menu
  4. Consider updating the "Widget columns" drop-down depending on the content you're displaying in this MM section*.
    *Example: Is it 40 brands? You'll need more than three columns for sure, otherwise your menu will be several inches tall.

MM Widget Math Examples


The following references the below screenshot.


The "Type" Column

In the "Type" column of every child you will see a number and in parenthesis a percentage. This number represents how many columns this particular mega menu item is going to take up


Engagement Menu: In the "Type" column for each child you see a 4. There are three 4's. 4 + 4 + 4 = 12. 12 columns total to work with.


Wedding Menu: In the "Type" column for each child you see different numbers. 4 + 5 + 3 = 12. 12 columns total to work with.



Below is a visual reference of the 12 columns you have to work with. THIS REFERENCE IS NOT TO SCALE.