Site Building Advice 11

5-minute website fixes: Clean up your website navigation with flyover menus

When you think of what makes a successful website, what comes to mind? Strong visuals, functional Online Store and great content, right? When you land on a stunning website, you don’t generally think, “Wow, that website navigation bar is impeccable!” do you?

That being said, if you land on a business website with a navigation taking a good portion of their homepage, “What a mess!” may come to mind.

You see, website navigation is a funny thing. It isn’t given it’s due credit when it’s good, but it definitely get’s the raw end of the deal when it’s bad. When it comes to building a professional website, although it may be seemingly low on the totem pole, great navigation is key.

Today, we’re going to give you the key details in cleaning up your website navigation in just a few easy step. The star of today’s show will be flyover menus.

Cleaning up your site navigation

To kick us off, let’s talk a little bit about what your website navigation should include. A professional website’s navigation bar will be limited to only the pages most important to every site visitor. This includes (but is not limited to) your:

  • Homepage
  • Contact page
  • Locations
  • Features/Services page
  • About us page
  • Frequently ask questions page
  • Online Store
  • Gallery

Think of these pages as categories, and the rest of your pages as subcategories. For example, if you have a physical business with multiple locations, it may be necessary to give each of the stores their own pages, but it’s not necessary to put them all in your top level navigation. This is where flyover menus come in.

While in Yola Sitebuilder, hop into the “Page” tab and click “Navigation.”

Editing site navigation with Yola

Once in your Page Manager, drag and drop your subcategories below your main category.

Changing the positioning of your Site Navigation

Once your subcategories are below your main categories, click the green arrow, to turn them into flyover menus.

Creating flyover menus with Yola

Voila! You’ve created a flyover menu, and you’ve cleaned up your website navigation.

Cleaned up navigation menu

Yola Flyover menus

Have any fixes you’d like featured? Let us know in the comments below!

  • http://www.gemipreciousjewellery.co.uk Alda

    I would love these flyovers on my site. Are they available to Yola Silver members yet?

    • http://www.yola.com/ Yola

      They absolutely are, Alda! Try them out on your site and let us know how they look!

      • http://www.gemipreciousjewellery.co.uk Alda

        Cheers! Will have a look and play around to see what I can achieve

        A

  • Stacy

    Is there any way to customize the look/feel or even just color of the flyover menu?

    • http://www.yola.com/ Yola

      Stacy, that’s absolutely achievable with our HTML widget! We have flyover pros on our support team – for these specific customizations, go ahead and email support@yola.com to have an HTML specialist assist you!

  • diane

    Are there certain themes that don’t support the drop-down style of sub menu that you are demonstrating? My sub menus are showing up down below not as a true flyover. Any ideas?

    • http://www.yola.com/ Yola

      Hi Diane,
      It sounds like you are using a Style that supports a horizontal second-level menu set up, a premium feature of Yola Gold and Yola Silver, which is why you are seeing it display as such!

      The flyover menu is available on all but 8 of our free Styles at this time. If you are looking for the flyover menu to display as it does in our examples, please try out a new style. SuperFlat and Skyline are two of our newer styles. They both work hand in hand with our Style Designer, allowing endless opportunities for customization.

      If you are willing to share your website URL with us, we would be happy to take a closer look at this with you, and offer further suggestions!

  • Lagie Kanaye

    Is there a way I can add an outside site to my navigation? I’d like to add a magazine’s website.

  • Guest

    Would you please be able to tell us how we can make the parent menu item non-clickable? Cheers!

  • Saskia1770 .

    Would you please be able to tell us how we can make the parent menu item non-clickable? Thank you!