CIBDWBB Ep.4: Explore More With Modern Navigation

How to create a super menu within a modal to free up navigation space. How to mimic a popular Themeforest Theme navigation design with Beaver Builder. How to think simply, and serve up smooth navigation to your users.

Subscribe to us on Youtube

Welcome to episode 4 of ‘Can It Be Done With Beaver Builder?’. In this episode, we will be exploring two navigation designs that we will see if we can build with Beaver Builder.

What We Will Learn

  • How to create a super menu within a modal to free up navigation space.
  • How to mimic a popular Themeforest Theme navigation design with Beaver Builder.
  • How to think simply, and serve up smooth navigation to your users.

First Design Excercise

The first exercise is from https://staging1.tickyboommainsitephase2.mystagingwebsite.com, and it involves creating a ‘Explore More’ navigation with a super menu sliding in. This is a great way to create space, while still serving up all the essential bits of info to your user.

Second Design Excercise

The next exercise is building the navigation from a Themeforest theme ‘Stockholm.’ Can Beaver Builder build a Themeforest theme navigation? Watch to find out!

Tools Used

Additional Resources:

Unicode Arrows: http://xahlee.info/comp/unicode_arrows.html

Trigram Unicode: http://graphemica.com

Funny Notes

I ended up redoing my ‘Explore More’ super menu after the video. As I was doing the video, I felt it was too bland and could be designed better. Yay!

Another funny note is that I did the ‘headwhip’ of when you think you have a problem solved only to see on refresh it is not. That usually happens when you move too fast and miss the little things. This is basically #designlife 

Finally, the bill of my hat was green, so yea…

Go back to the blog, or see related:

Thanks for sharing!

Share on facebook
Facebook
Share on twitter
Twitter
Share on linkedin
LinkedIn
Share on pinterest
Pinterest
Share on whatsapp
WhatsApp
Share on email
Email
Share on reddit
Reddit
Share on telegram
Telegram