top of page

Lukassen Tutorials

CREATED BY

6:02

How to Create Side Menu in Wix (2022) | Wix Create Side Menu

How to Create a Side Menu in Wix (2022) | Wix Create Side Menu


In today's fast-paced digital world, having a user-friendly and visually appealing website is essential for any business or individual looking to make their mark online. With Wix, you can create a stunning website that not only looks professional but is also easy to navigate. One way to improve navigation on your Wix website is by adding a side menu or sidebar.


In this blog post, we'll guide you through the process of creating a side menu in Wix, so your visitors can easily browse your site and access the information they're looking for.


> Before we get started, it's worth mentioning that this blog is a part of Live Learning EditorX.io - a website that hosts monthly NoCode Design Challenges with prizes and offers valuable resources on building design businesses and furthering your career. Join the community to learn, grow, and connect with like-minded individuals!


Now, let's begin.


Step 1: Access the Wix Editor


First, make sure you're in the Wix Editor and not the Wix ADI Editor. If you're unsure how to switch from the ADI to the Editor, you can follow this tutorial, and then come back to this post once you're ready.


Step 2: Add a Lightbox


With the Wix Editor open, locate the `Add` button on the left side of your screen. Click `Add`, then hover over `Interactive`, and finally, select `Lightboxes`. Lightboxes allow you to create a floating, interactive element that can be used as a side menu.


Choose a lightbox that fits your needs. For a side menu, we recommend selecting a lightbox that already has a sidebar or side subscribe element. This will make the process of customizing your side menu easier.


Step 3: Customize Your Lightbox


After adding the lightbox to your website, it's time to customize the elements within the lightbox to create your side menu. First, remove any elements that you don't want or need within your side menu. For example, you may choose to remove a subscribe form or an unnecessary text box. Feel free to move elements around and resize them to create a visually appealing and functional side menu.


Next, customize the text within your side menu. You can edit the text to say something like "Browse Our Site", and adjust the size and alignment of the text to fit nicely within your side menu.


Step 4: Add Navigation Links


Now that your side menu is starting to take shape, it's time to add the actual navigation links. To do this, click the `Add` button once again, then hover over `Menu`. Choose from the menu options available, and add the menu to your lightbox.


Customize the menu according to your website's design and content. Adjust the formatting, colors, and fonts if necessary. Be sure to link each menu item to the corresponding page or section of your website, so visitors can easily navigate to the information they're looking for.


Step 5: Optional - Add a Subscribe Form or Other Elements


If you'd like to include a subscribe form or other elements, such as social media icons, within your side menu, simply click the `Add` button, and add the elements of your choice. Customize these elements as necessary to match your website's design and functionality.


Step 6: Add a Menu Button to Your Website


Finally, your side menu is complete and ready to use! The last step is to add a menu button or link to your website that will trigger the lightbox, making the side menu visible to your visitors. To do this, simply click the `Add` button again, then locate the button or link you'd like to use, and add it to your website. Configure the button or link to open your lightbox, and ensure it's visible and accessible on your website.


And that's it - you've created a side menu for your Wix website! Now your visitors can quickly and easily navigate your website, while enjoying a clean and professional design.


Creating a side menu, or sidebar, is an essential part of building a user-friendly, functional website. By following this tutorial, you can easily create and customize a side menu that matches your website's design and helps your visitors find the information they need.


Remember to check out Live Learning EditorX.io for more valuable resources and opportunities to grow your design career, and don't forget to join the community for monthly NoCode Design Challenges with prizes!


Happy designing!

Join over 5,000+ people learning, helping each other to scale their freelance/design business, taking no-code challenges, collaborating, talking about their projects, and more!

Join Designers & Creatives From All Over The World!

Supported by our partners and affiliates

More Like This #Tag

Editor X Tutorial For Beginners | Create a Website With Editor X 2022

All About Websites

7:04

How To Send Automated Emails in Wix - Wix.com Training Tutorial + AUTOMATED FUNCTIONS

Wix Training Academy

10:06

How to create click interactions | Editor X

Lo-FiX

5:12

Hover Interactions & Team Section | Wix Fix

Wix Fix

11:46

Advanced SEO Markup in Wix | Wix Fix

Wix Fix

8:32

How to Add Google Analytics to WIX | Wix Fix

Wix Fix

4:13

How to impress with a digital portfolio | D&AD x Editor X

D&AD - Creative Advertising, Design and Digital

18:30

What are the biggest benefits of Editor X for clients and agencies

Editor X TV | With Brandon Groce

5:13

Top 5 Best "NO-CODE" Website Builders (2023)

TechGumbo

6:45

TOP 5 NO CODE WEBSITE BUILDER 2023 - Website Builder FREE

ClayDesk E-Learning

9:05

Live webinar | Content manager part 1 | Editor X

Editor X

1:04

How to Add HTML Code to Editor X (Easy 2022)

All About Websites

0:58

bottom of page