Working with Menus in BoldGrid | BoldGrid

BoldGrid gives you the ability to create, delete, reorder, add items, or assign menus to locations on your website. By working with menus, you can easily setup your social media menu to link to your own accounts. In this guide, we will show you how you can start working with menus in your BoldGrid site.

How to Create a new Menu

  1. Login to BoldGrid.
  2. Click Customize, then Menus.
  3. You will see the existing menus listed. Click the + Add a Menu button.2016-1-adding-menu
  4. Enter your new menu name, then click the Create Menu button. You must then add items to the menu, which is covered in the next section.2016-2-creating-menu

How to Add Menu Items

  1. Login to BoldGrid.
  2. Click Customize, then Menus.
  3. Click the menu you want to add items to, then click the + Add Items button.2016-3-add-menu-items
  4. Choose the type of menu item you want to add, then click the Save & Publish button. Options are Custom Links, Posts, Pages, Categories, or Tags.

How to Delete a Menu

  1. Login to BoldGrid.
  2. Click Customize, then Menus.
  3. You will see your menus listed. Select the one you want to delete.
  4. Click the Delete Menu link.2016-5-delete-menus
  5. Click the Save & Publish button.

How to Setup your Social Media Menu

  1. Login to BoldGrid.
  2. Click Customize, then Menus.
  3. Select the Social Media link.2016-6-social-media-menu
  4. You will then see a list of available social media options including Facebook, Twitter, Google Plus, LinkedIn, and Youtube. Click them to add a link to a link to your social media page. You only have to setup the ones you want to use.2016-7-social-media-menu
  5. Click the Save & Publish button.

How to Reorder menus

  1. Login to BoldGrid.
  2. Click Customize, then Menus.
  3. Select the menu you want to reorder.
  4. Click the Reorder link.2016-8-reorder-link
  5. Click the arrows to move the menus up and down. Items higher on the list display first on the menu.2016-9-reordering
  6. Click the Save & Publish button.

How to set Menu Locations

  1. Login to BoldGrid.
  2. Click Customize, then Menus.
  3. Click the Menu Locations link.2016-10-menu-locations
  4. You will see the menu locations listed such as Primary Menu, Left Below Primary Navigation, Right Above Primary Navigation, Header Upper Right, and Footer Center. Keep in mind the menu locations will differ based on your specific theme. Click the drop-down box below the menu locatons to choose which menu will display there.2016-11-choose-menu-locations
  5. Click the Save & Publish button.

 

Get more for free by signing up with BoldGrid Central Create Account

26 thoughts on “Working with Menus in BoldGrid

        • Here are the basic steps, though it may differ on your specific theme.
          1. Login to the Dashboard
          2. Click “Customize”
          3. Click “Menus”
          4. Click the menu you want to add a child to, such as “primary”
          5. Add menus as needed
          6. Move the new menus below the menu you want to drop down, and drag them slightly to the right, almost like it is indented. It will then add the menu item as a drop down option

        • Hi Jen,

          I’m sorry to see you are experiencing issues with your Menus. I’m not quite sure what you mean by Child, Primary, and Top menus. To add a drop-down to your menu, simply drag and drop to indent the item in the list of menu items. If you are still experiencing issues with this, please be sure to provide the exact steps you are taking so we can replicate the issue you are having. At this time though, I am unable to determine an issue with BoldGrid menus, as described in this guide.

          Best Regards,
          Carlos D

    • Hello rd,

      You can adjust the size of the icons by using the Custom CSS tool located in the Advanced tab of the Customizer. Simply add the following code, close the editor, and click the “Save and Publish” button.

      #menu-social i {font-size:30px;}

      You can adjust the number 30px up or down to for the icon size.

      Kindest Regards,
      Scott M

    • There is not currently a “built-in” way to make a floating menu in BoldGrid. This means you will have to custom-code a solution or use a 3rd party plugin for adding this functionality. There are many plugins available for adding a floating menu in WordPress, view them here:
      https://wordpress.org/plugins/search.php?q=floating+menu

      You may have to test several to determine the one that works for you. Ensure it is compatible with the latest version of WordPress (4.7).

    • Hello Benjamin,

      Apologies, but there is no direct way to change the font of the menu. You may want to adjust your background image using an image editor. Themes developed for BoldGrid are responsively designed so that the color and font type are considered against the background image.

      If you have any further questions, please let us know.

      Kindest regards,
      Arnel C.

    • Hi, Julie.

      Yes, you can make the Top Menu without having a link to click on. Have a look at our article on How to Disable a Top Menu Item Link. Setting up the “Custom Link” menu item as outlined in the guide, will result in a non-clickable menu item (like the top menu), which you can add sub-menus to, as well. I hope this helps!

      Sincerely,
      Carlos E

  1. janterraadmin says:

    Hi I was wondering why I would have child pages showing up on my main menu, and as they should be as child pages? I should not this is only a few of them, there are other child pages that are presenting as they should.

    • Hello janterraadmin,
      Thank you for contacting us. As a test, try deleting the menu item from the main menu as described above. This should remove the link to the pages in your menu.
      Thank you,
      John-Paul

  2. Hi there!

    Please help me.
    1. How our Navigation bar will stick to the top when we reach its scroll position. using bold grid themes and other than Boldgrid themes.
    2. How can we finish ATTRIBUTION PAGE linked in footer of Boldgrid themes Named as ” SPECIAL THANKS”.

    Best Regards,

    Javed Awan.

    • Carlos DaSilva says:

      Hi, Javed.

      Thanks for posting your comment regarding the navigation bar appearance when scrolling and how to edit the Attribution Page linked in your footer.

      The scroll effect requires custom CSS modification. You can use the following code:

      #site-navigation {
      background:#83745d;
      height:60px;
      z-index:170;
      margin:60 auto;
      border-bottom:1px solid #dadada;
      width:100%;
      position:fixed;
      top:0;
      left:0;
      right:0;
      text-align: center;
      }
      .site-branding {
      margin-top:60px;
      }

      You would add this code by navigating to Customize > Advanced > Custom JS & CSS, then copying/pasting it into the field labeled: Custom Theme CSS.

      NOTE: This is the code used for a test website I have, you may need to make adjustments to the code to customize the appearance, to match with your website.

      The Attribution page is not able to be edited. However, if you are using a Premium Connect Key, you can use our guide, how to remove the Attribution/Special Thanks Link, to remove it.

      I hope this helps!
      Sincerely,
      Carlos D

Leave a Reply