Build a Beautiful Navigation Menu with Breakdance Builder

Published by Justin on September 1, 2022
Last Updated: September 2, 2022 | Reading Time: 2 minutes

Website navigation is what users are going to see and use first when they're sifting through pages on your site. So you want that top bar to be both beautiful and functional. With Breakdance's drag-and-drop interface, you can easily add or remove elements from your navigation bar and set up custom links to pages on your site. In this tutorial, we'll recreate the main elements from the list of main features on the official Breakdance website in our own menu bar.

Default navigation menu dropdown in Breakdance Builder

Navigation Menu Elements in Breakdance

If you add a menu builder element to your page, you should see it automatically populate with some basic elements like custom dropdowns, menu links, and normal dropdowns. Each of these has its own purpose:

Menu Links - For the simple links that just go to other pages on your website.

Normal Dropdowns - These are mainly used for grouping together menu items under a common heading. You can have various links and style them with icons accordingly.

Custom Dropdowns - For more complicated links, like those that open up a modal window or link to an external page. We've used this to open login & register forms in the top right corner of our site.

Menu builder with dropdown for additional menu options in Breakdance Builder

Now that we know the basics, let's move on and recreate the main features from the Breakdance website!

Edit Menu Elements in Breakdance

We decided to put together a video showing how to manipulate the menu, we created a menu with the same styling options as the default menu from above.

Written by Justin
Justin is the founder of Gold Penguin, a web design and marketing agency that helps businesses achieve their online goals. Justin has a passion for web design and marketing, and he loves working with clients to help them grow their businesses.

Comments

Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
Made with 💛 by Gold Penguin © 2022