top of page

Copied

WEBSITE ESSENTIALS

10 essential Wix tutorials for beginners

Emily Shwake

Wix tutorials

Having spent years as a Wix Blog editor, I know that learning how to make a website can be intimidating, even when using a website creator that’s as intuitive as ours. I’m still discovering new and exciting ways to use it. That's why I think it's so valuable that Wix's YouTube offers up so many step-by-step, expert-led Wix tutorials to elevate your understanding of our platform. So without further ado, here are the 10 most essential Wix tutorials.




01. Set up your site: “Get to know the editor


Getting started is typically the hardest part of any creative endeavor—but that’s not necessarily the case with Wix. As Wix Editor Specialist Ali Flood explains in this lesson, you can choose to start with the AI website builder, a website template or a blank slate. “This video is going to take you through what templates are, how they work and how to choose the right one for you,” says Learning Designer Allison Shelton. “Then, it’ll show you around the Editor and explain what you can do.”


In seven short minutes, you’ll get a comprehensive overview of the workspace. You’ll get a sense of the foundational design elements, including sections, site themes, layers, the media manager and the mobile editor. If you’re looking to go into detail, you can watch the full course that this lesson belongs to here: build your website with the Wix Editor.






02. Customize the layout: "Work with sections & strips"


When you’re working with the Wix Editor, understanding the functionality of sections and strips is paramount. Ali returns in this video to explain the difference between the two and how to take full advantage of the tools.


Sections in the Wix Editor function as containers, ensuring that you can easily move, make quick edits or reorganize related content without affecting the rest of the webpage. “Things in the Editor are made in sections,” explains Allison. “Ali goes into what sections are, how to change the backgrounds of the sections and how to put things into your sections.” She also shows you neat aspects of this tool, including how to get AI-generated layout suggestions.


Strips help you get creative with layouts without losing the structure that is so important for ensuring a user-friendly and aesthetically pleasing design. It’s also essential for creating a responsive layout (one that always looks good, regardless of the size of the screen it appears on), as the strip will scale proportionally and adapt the layout so that it still looks nice.





03. Make it your own: "How to customize your site themes"


Because your site functions as a digital avatar, it’s the best opportunity to communicate your branding to the masses. Keeping the colors and typography in alignment with your style guide helps to reinforce that branding. Wix’s Site Theme feature makes this easy, in that you can update every single element on your site in a couple of clicks. In two and a half minutes, this video will teach you how this website feature works and how to take advantage of it.


If you haven’t picked your brand colors or fonts yet, the Site Theme feature has matching colors and fonts to help you find the right match for your business. For example, if you’re starting an accounting business, the “technical” theme will likely be a better fit than the “retro-vibrant” theme.





04. Add and edit media: "Add & customize media"


While pretty colors and cool layouts can draw your visitors in, informative images and video will make them want to stay. Therefore, deciding which to feature and learning how to edit them is a necessary skill. This video walks you through your options for uploading, editing and even creating media for your Wix site. “It also gives you best practices in terms of things like image size and site speed,” says Allison. “Then it takes you through cool features like how to mask your video or put in some vector art.” These features are among the many reasons Wix is one of the best website builders for photographers on the market today.


Besides allowing you to upload imagery and video from your computer and your social channels, the media manager gives you access to free media libraries from Wix, Unsplash and Shutterstock.





05. Optimize your design for mobile: "Design your mobile site"


Designing a mobile site is a vital, yet often overlooked, step in the website launch checklist. “It’s so important these days that all the function and design [of your site] is optimized for everyone on their phone,” says Allison. That’s why this tutorial is a must-see. It explains how to make the mobile version of your site leaner and simpler than the desktop version. This is vital because mobile users want to get things done fast—faster, even, than desktop users.


Wix's AI capabilities automatically optimize your desktop design for mobile, but you can always use the mobile editor to make extensive customizations. Ali demonstrates how to hide sections that aren’t as relevant to mobile users and add elements that only appear on mobile, such as a welcome screen that’ll give your site a bit of extra time to load. She also offers some tips for designing for mobile:


  • Optimize for readability: I don’t have to tell you that mobile screens don’t make reading easy. These tiny screens aren’t accommodating to large fonts, and they can make long paragraphs seem never-ending. Ali shows you how to reduce the size of your text or even change the typeface.

  • Make navigation even simpler: Mobile users want everything at their fingertips—literally. Ali recommends either "freezing" your header menu so it always remains at the top of the screen or adding a "back to top" button so that navigating to a different page is nearly instantaneous. She also suggests making buttons larger to accommodate thumb clicks.

  • Minimize scroll: A repeater on Wix is a list of items that have the same design and layout, but different content in each. This feature makes it easy to display and manage large amounts of content on a single page. In terms of mobile design, this is especially handy, because you can make tweaks (such as adjusting the vertical spacing) that apply to the whole layout, ensuring a cohesive and user-friendly mobile experience.




06. Open an online store: "How to add products"


The Wix eCommerce system is pretty intuitive, so you don’t really need to watch this video to learn how to add products, but Learning Designer Henry Collie ups the ante by sharing tips he gathered from building his own shop.


To start, he introduces you to a few integrations that can help you make your online business a success, such as the dropshipping builder and other Wix apps that will make migrating your existing store to Wix eCommerce a breeze. Finally, Henry shows you how to manage your inventory so that your product availability is always up-to-date.


If you found this lesson insightful or already know how to add products to your shop, you can check out the entire course here: Get started with Wix eCommerce.


Don’t waste any time—open your online store with Wix today.





07. Promote your site: "​​Get your website marketing-ready"


In this lesson, Content Lead Kendall Breitman will guide you through the art of optimizing websites for conversions. You’ll learn how to make a good first impression—and encourage conversions right on the spot. “I would definitely recommend going through the whole course ("Promote and grow your business with Wix") if you’re a business that needs to get going on getting found,” says Allison. “There are a lot of different ins and outs of promoting your site, whether you’re going to blast announcements on social media, add a blog or focus on SEO.”





08. Add some pizzazz: "Use images for navigation"


If you want to make a website that leaves a lasting impression, this course—"Design your website with advanced features"—is for you. Led by UX Designer Robbie Sims, you'll learn how to use customized animations, interactive galleries, sticky videos, mobile welcome screens and more to deliver a truly unforgettable experience.


While each lesson zeroes in on specific features, the real takeaway of this course is how limitless the Wix Editor is when you get creative with it. You’ll discover how you can leverage features originally designed for one purpose to create an element with an entirely different purpose. For instance, this lesson shows you how you can use the Subscribe Lightbox to create a drawer-like navigation menu and how to use the Grid Gallery to turn ordinary images into dynamic page links.






If your eyes glaze over when you’re faced with large amounts of data, you’re not alone. But you’re missing out if you let that stop you from capitalizing on the valuable reports and insights that you’ll find on the Wix Analytics dashboard. In this four-minute video, Henry gives you tips and tricks for using them to their full potential. He demonstrates how to customize the reports to your needs and how to interpret the data.


It's worth noting that since the publication of this video last year, we've introduced an AI-powered Benchmarks report. This report can help you assess your site's strengths and weaknesses, offering insights to enhance your performance.


Hungry for data? Explore Wix Analytics today.





10. Add your own code: "About Velo"


Yet again demonstrating the boundless potential of Wix, this lesson introduces you to Velo, a full-stack web development solution that allows you to add your own code to your Wix website. Developer Advocate Joshua Alphonse takes you on a guided tour of the environment, highlighting its various features and potential. “Velo is a JavaScript-based language that is specific to Wix, but it’s really accessible to anyone with coding knowledge,” says Allison.


Although Wix designed this tool with seasoned coders in mind, this lesson illuminates how useful it is for getting started on your coding journey. Joshua's demonstration reveals Velo's seamless integration with the drag-and-drop editor, allowing you to harness the power of both tools concurrently. Check out the entire Velo course here.


Check out this explanation of the difference between web designers vs. web developers to find out whether web development would be a good path for you.





Ready to put these lessons into practice? Sign up for Wix today.

Was this article helpful?

bottom of page