First of all, welcome to Wix. We applaud you for taking this important step in deciding how to build a website.
Wix offers a convenient way to make a website on your own, but let’s face it - none of us was born an expert in using the Wix Editor. Although the learning curve is short and sweet, we nevertheless want to help new users like yourself have a smooth experience.
Consider this your complete guide to making a website for anyone who wants to build a powerful online presence for a business, an organization or personal hobby. Below you’ll find 10 of the most helpful tutorials about creating a website with Wix that will offer support as you go. As an added bonus, we’ve also included a set of guides that will help optimize your site’s performance after it's published.
Now, let’s build a website:
01. How to use the Wix Editor
Let’s start at the very beginning by getting to know the Wix Editor (and learning what is Wix), where all the magic happens.
Whether you start completely from scratch, or utilize one of our customizable and simple website templates, this is where you’ll add your own content, design pages and customize your work until you’re ready to save and publish.
Check out our Wix Learn tutorials as a starting point to understand all the capabilities of the Wix Editor.
02. How to make your site mobile friendly
Nowadays, no website should go live without a mobile version. Mobile internet use is rapidly increasing, already surpassing usage from desktops and tablets.
The Wix Editor comes with a dedicated Mobile Editor, so you have full control of your web design and what your site looks like when viewed from a smartphone. You can shift, crop, resize or delete items on your mobile site without affecting its desktop version. Follow the steps in this tutorial and learn how to set up the mobile version of your site.
03. How to display images
Principles of website design dictate that terrific visuals make a website more appealing. With the Wix Pro Gallery, you can showcase high quality images that enrich your website’s appearance and make a stunning impression on visitors.
This Wix tutorial shows how to add images to your site while controlling the quality, size and layout. The large selection of gallery layouts means there’s something for everyone – whether you’re a professional photographer building an online portfolio, or a personal trainer making a site to promote your services.
04. How to add video
Videos are commonly used on websites as an exciting way to deliver information. Not only that, but if you look around at recent web design trends you’ll notice that some of the most impressive sites today use videos as purely aesthetic elements.
This tutorial will show you the revolutionary ways in which you can add high quality videos to enhance your site. Going over the various layouts and uses for videos on a Wix site, you’ll learn how to upload a video from just about any location - your computer, YouTube channel or Vimeo account, to name a few.
Once you’ve mastered the task of uploading videos, check out some of Wix’s cutting-edge video design features, like VideoBox and Video Mask. Powered by innovative technology, these tools are easy to master, and will take your site’s visual appearance to a whole new level.
05. How to use strips
A strip is a full-width website element that can be used to create different sections on any given page, forging a unique and organized website layout. Your website colors can really stand out on a strip, as well as text, images or video.
Wix provides a variety of strip templates, and each of them serve a different purpose. The good thing is, you can include as many unique strips as you want or need in your website’s design. Understanding how to use these elements will save you time and ensure you get the outcome you want. Learn how to add, customize and organize strips on your website with this tutorial.
06. How to add site anchors
We love long website layouts that allow visitors to scroll smoothly as they browse through all the content. However, on the other hand endless scrolling becomes inconvenient if visitors can’t find the section they need quickly. This is where website anchors come into play.
Anchors are links placed inconspicuously throughout your page that take visitors directly to the relevant spot when they select it from the navigation menu. This tutorial shows you exactly how to set up this neat tool.
07. How to design headers and footers
The header and footer of your website are located on the top and bottom of each page, respectively. They play a strategic role in your website’s navigation, directing users to the different pages of your site and helping them find basic information in a jiff.
The most basic header design will include a navigation menu and business name, while good footer design practice means including contact information or links to social media accounts. However, headers and footers can be further personalized to set the right tone and improve the efficiency of your site.
This tutorial will act as header and footer design 101, guiding you on how to add content to each of these sections, resize them, and even freeze or hide them when necessary.
08. How to add buttons and customize links
A website might be the only case when you actually want someone to push your buttons. Buttons encourage visitors to take action on your website. Depending on your goals, this might mean booking an appointment, completing a purchase on your site, or simply signing up for a mailing list.
An effective button should be strategically placed, displaying a clear call-to-action and a link to the destination page. This tutorial will show you how to design and add a button to your site, and customize its link.
09. How to add parallax scrolling
Parallax scrolling is a great way to grab attention on your website. This web design effect made its debut in 2011, and it hasn’t ceased to evolve or impress visitors since. Parallax scrolling is used to create multiple layers on your site where the background moves slower than the foreground. This ultimately gives off a 3D effect when users scroll down a particular page.
When building a website from scratch, you don’t even need to know a single line of code in order to implement this highly engaging design trend - it's as easy as clicking a button. Watch this tutorial and learn how to add parallax strips with zoom in, reveal and fade effects into your website.
10. How to add a lightbox popup
If we’re totally honest, pop-ups can be pretty bothersome. Especially when the moment you arrive at a site you’re bombarded with a pop-up that covers the center of the screen and consequently, all of its content.
But Wix lightbox popups are extremely beneficial, and just too pretty to stay mad at. You can use these eloquent popups to update customers or highlight notifications on your site. Here’s the trick to a good lightbox popup: it’s all about the right placement, timing, design and using good microcopy.
In this tutorial, we’ll learn how to use the Wix Editor to create a lightbox with hover effects - going over how to add text, customize the design and place it on the correct pages of your site. This technique is great for any website, and can help you increase sales or build your audience.
Bonus Wix tutorials to improve your website
Once you’ve understood the basics of designing your website with Wix, take it to the next level by implementing tools that will help its performance and build your presence online:
How to get your site found on Google
Search engines are an indispensable source of incoming traffic. This tutorial takes you through the necessary steps to make sure that your website is primed and ready to be indexed and ranked by Google. Generally speaking, these actions involve optimizing your content and implementing keywords so your site will rank higher in the results.
Learn how to get your site found on Google here.
How to get a customized domain name
A customized domain name enhances your website’s reliability in the eyes of visitors and makes it clear that you’re a professional. In addition, having a customized domain name greatly improves your site’s SEO and helps you rank higher in search engine results.
There are two methods to get a customized domain name for your Wix site. You can purchase a domain name directly from Wix, but if you already have a domain name from another registrar, you can easily connect it to your Wix site as well.
How to boost your website with apps
One of the coolest things about Wix is that in addition to all the powerful editor tools, you get access to dozens of excellent Wix website apps that offer great added value. From enhanced contact forms to eCommerce tools, the Wix App Market offers something for everyone.
Learn how to add multiple apps to your site and boost its performance here.
How to add external tools with HTML codes
Found a nice online tool that you’d like to integrate into your own webpage? That’s exactly what the HTML tool is for. This feature lets you paste any HTML code into a frame on your site. Once published, you’ll see the embedded tool on your page.
All you need to do is grab the HTML code, and follow these steps to learn how to add external tools with HTML codes here.
How to be precise with editor rulers
The drag and drop interface of the Wix Editor lets you have maximum control over your website design. When you want to make sure that your design stays accurate and symmetrical, all you need to do is add rulers that guide you to the exact positioning for your site elements. You’ll never have issues with aligning your buttons with your texts and photos again.
Learn how to enable rulers in your editor mode here.
Ready for more? Visit the Wix Help Center for more how-to guides on all things Wix or check out these free video courses to learn how you can get the most out of your website.