{"id":232,"date":"2018-08-20T14:13:32","date_gmt":"2018-08-20T21:13:32","guid":{"rendered":"http:\/\/create.twu.ca\/eportfolios\/?page_id=232"},"modified":"2020-08-20T13:56:59","modified_gmt":"2020-08-20T20:56:59","slug":"creating-a-menu","status":"publish","type":"page","link":"https:\/\/create.twu.ca\/eportfolios\/wordpress\/creating-a-menu\/","title":{"rendered":"Creating a Menu"},"content":{"rendered":"

Menus determine how visitors will interact with your content. They drive navigation and good navigation will allow your visitors to successfully search your site, and they will stay longer as they will be they will be able to find what they are looking for without extraneous scrolling or button clicking. The big thing you need to remember is to KEEP IT SIMPLE!<\/p>\n

Visitors will read your menu from left to right so make sure the most important links come first. Also, it looks untidy if titles are lengthy so keep them short. Short, sharp and punchy link names work best to capture your readers attention!<\/p>\n

Most often, menus appear in the header and\/or footer of a website, the default placement of your menu will depend on the theme you have chosen. Commonly the site\u2019s menu will appear near the top of the page as a horizontal bar below the site\u2019s title. On a mobile device, the menu may appear as a hamburger icon (three short horizontal lines) in the top left or right corner of the device.<\/p>\n

\n

Defining a Menu<\/h3>\n
\n
\n

The following steps outline how to define a menu. You must define a menu before you can add items to it:\"\"<\/p>\n

    \n
  1. Click\u00a0Appearance\u00a0<\/strong>then click\u00a0Menus<\/strong><\/li>\n
  2. Select\u00a0create a new menu<\/strong>\u00a0at the top of the page.<\/li>\n
  3. Enter a name for the menu in the\u00a0Menu Name<\/em>\u00a0box.<\/li>\n
  4. Click the\u00a0Create Menu<\/strong>\u00a0button.<\/li>\n<\/ol>\n
    \n<\/div>\n<\/div>\n

    Adding the menu to your site<\/h3>\n
    \n
    \n

    If your current theme supports custom menus, you will be able to add your new menu to one of the\u00a0Theme Locations<\/strong>.<\/p>\n

      \n
    1. Scroll to the bottom of the menu editor window.<\/li>\n
    2. In the section titled\u00a0Theme locations<\/em>, click the check box for the location where you want your menu to appear.<\/li>\n
    3. Click\u00a0Save menu<\/strong>\u00a0once you\u2019ve made your selection.<\/li>\n<\/ol>\n

      \"Adding<\/p>\n

      \n<\/div>\n<\/div>\n

      Adding Items to a Menu<\/h3>\n

      You can add different link types into your menu. These are split between panes left of the menu you\u2019re currently editing.<\/p>\n

        \n
      1. Locate the\u00a0Add menu items\u00a0<\/strong>pane. (For these instructions we will be using the Pages pane)<\/li>\n
      2. Within this pane, select the\u00a0View All<\/em>\u00a0link to bring up a list of all the currently published Pages on your site.<\/li>\n
      3. Select the Pages that you want to add by clicking the checkbox next to each Page\u2019s title.<\/li>\n
      4. Click the\u00a0Add to Menu<\/strong>\u00a0button located at the bottom of this pane to add your selection(s) to the menu that you created in the previous step.<\/li>\n
      5. Once all the items have been added you can drag and drop them into the order you wish for them to appear.<\/li>\n
      6. Click the\u00a0Save Menu<\/strong>\u00a0button once you\u2019ve added all the menu items you want.<\/li>\n<\/ol>\n
        \n
        <\/figure>\n
        \n<\/div>\n

        Creating Drop-down (Multi-level) Menus<\/h3>\n

        Using drop-down menus keeps your sites navigation simple and clean. We caution on going too deep as it can be frustrating for people who are accessing your site on a mobile device. If possible, keep your menu structure to 2 levels. When planning your menu\u2019s structure, it may be helpful to think of each item as a heading in a report. Imagine creating the table of contents for this report: All the level 1 headings are nearest to the left, level 2 headings are slightly indented to the right, level 3 headings are indented even further to the right. WordPress has a simple drag and drop interface for creating drop-down menus. If you have not ordered your menu items by dragging and dropping into the correct order as indicated in step 5 of\u00a0Adding Items to a Menu<\/a>\u00a0you should do so now.<\/p>\n

        To create a drop-down list in your menu you need to position the \u201cchild\u201d under its \u201cparent.\u201d The following instructions outline how to create drop-down (multi-level) menus:<\/p>\n

          \n
        1. Ensure the menu items are in the correct order.<\/li>\n
        2. Position you mouse over the \u201cchild\u201d menu item.<\/li>\n
        3. Hold the left mouse button down and drag the item to the right, release the button.<\/li>\n
        4. Repeat steps 2 and 3 for each child item.<\/li>\n
        5. Click the\u00a0Save Menu<\/strong> button.<\/li>\n<\/ol>\n