How to build your first website using Wix (step-by-step guide)

Tools list 

 

 

Start here

Wix is a pretty intuitive website builder. But because it offers a ton of options, you could easily feel a little overwhelmed when you use it for the first time.

So if this is your first time making a website with Wix, then this guide is for you.

In this guide, I’ll introduce you to the Wix dashboard and show you how it works. We’ll also see the different settings and steps you need to do to publish a shiny new Wix website.

Ready?

Let’s begin.

Signing up for Wix

As you’d know, Wix offers five premium plans. Choose any one that suits your needs the best.

VIP

eCommerce

Unlimited

Combo

Connect Domain

Unlimited bandwidth 10GB bandwidth Unlimited bandwidth 2GB bandwidth 1GB bandwidth
20GB storage 20GB storage 10GB storage 3GB storage 500MB storage
Connect your domain Connect your domain Connect your domain Connect your domain Connect your domain
Free domain* Free domain* Free domain* Free domain*
Remove Wix Ads Remove Wix Ads Remove Wix Ads Remove Wix Ads
Customized favicon Customized favicon Customized favicon Customized favicon
Form builder app Form builder app Form builder app
Site booster app Site booster app Site booster app
Online store Online store
$24.50/mo $8.25/mo $6.25/mo $8.50/mo $4.50/mo

Get started, signup on Wix now

* A quick note about the domain name:

When you sign up for an annual Combo (or any higher) plan, Wix offers you a free domain name.

But if you’ve a little cash to spare, I’d recommend that you don’t take this free domain.

Instead, buy it from a third-party registrar like Name Cheap. Buying a domain name independently makes switching website platforms and hosting providers a lot easier. (Namecheap offers some great deals, and you can book your domain name for as little as  $0.88/yr.)

But if you’d rather not shell out the money, go ahead – take advantage of the free domain.

Okay … so back to the signup process … as soon as you sign up for any Wix plan, Wix will ask you about the type of website you want to build.

A little more about Wix

We regard Wix as one of the best website builders around but there’s always pros and cons with every tools. Based on Aileen Rogando’s Wix review, here’s what make and break Wix.

What Wix does well:

Users who gave Wix a positive rating were happy with how intuitive Wix is. The drag-and-drop system is easy to use, and it allows businesses to create websites without any HTML coding knowledge.

What Wix does not do well:

Negative Wix reviewers complain about its slow servers. Websites created with Wix sometimes load slowly and are thought to not be very SEO friendly, which means websites made with Wix may not show up on the search engine results page.

Building a website with Wix

For this tutorial and walkthrough, we’ll see how to build a business website with Wix. So, at this point, when Wix asks for the website type, let’s select the ‘Business’ type.

After you tell Wix the type of site you want to build, Wix offers 2 options for creating your site:

adi-or-editor

Two options for creating your site with Wix: Wix ADI or Wix Editor.

We’ll look at both these options in the following sections.

Option #1: Building a Wix website using Wix ADI

Wix ADI (or Wix Artificial Design Intelligence) is a unique Wix feature/tool that just asks for inputs from you and builds your site for you – automagically!

To see Wix ADI in action, let’s take forward our business website example. Just click on the ‘Start with Wix ADI’ button.

In the next step, Wix asks for the kind of business website you want to build. It even suggests some options. If you aren’t sure about the kind of website you want to make, just hit some keywords and Wix will suggest relevant ideas.

For this tutorial, let’s build a digital marketing agency/business website.

wix-adi-step-1

When you specify your business website’s nature, Wix ADI asks for the desired set of features on your website. Here, you need to think about all the things you want to be able to do on your website.

For our example, we’ll choose all the features Wix suggests except the ‘Take bookings & appointments’ feature.

wix-adi-step-2

After learning about the desired features of your website, Wix ADI prompts for the website’s name.

For the sake of this example, I’m naming our website ‘BuildThisDigitalMarketing’.

Wix ADI now asks for some more business information like the business address and more.

Give Wix ADI as much information as you can because it will use this information on the relevant sections on your website (like your website’s footer and contact page.)

wix-adi-step-3

Finally, after you’ve given all your feature preferences and information, Wix ADI will be ready to build your website.

Click on ‘Start’.

Click on ‘Start’.

On the next screen, Wix ADI asks for your color scheme preference.

For our example, I’m choosing the ‘Spark’ color scheme.

For our example, I’m choosing the ‘Spark’ color scheme.

With the preferred color scheme, Wix ADI is now ready to work on the website’s homepage.

And in about a minute or so, Wix ADI should be ready with your website.

In our example, Wix ADI created the following homepage for our digital marketing agency:

wix-adi-sample

Now I can’t say for you but I really dislike the design Wix ADI built for me.

In fact, I wouldn’t ever use it.

But you should know that this design is not final. You can add new sections to it. The color scheme and elements can also be changed. And it can even be redesigned from scratch.

Anyway, let’s forget the design for a second and see what else the Wix ADI program has done for this website. For example, let’s see if Wix ADI at least chose the right pages to add to our site.

To check this out, click on the ‘Page: Home option’ option on the left panel on the dashboard.

The following screenshot shows the different pages that Wix ADI chose to create for our digital marketing agency website:

wix-adi-step-7

As you can see, Wix ADI added a bunch of ‘Shop’ pages to our website even though we were building a business website. I guess these pages got added because we chose the feature to ‘Sell online’. Other than the shop pages, Wix ADI has also added a blog page, which is fine.

The bottom line: Wix ADI is certainly not ready for prime time

As you just saw, although designing a website with Wix ADI was convenient, the results were far from great.

Maybe this was just a one-off example where Wix ADI didn’t quite get it right. Nonetheless, now you know what to expect from this option.

We’ll now see the second option of creating a website using the Wix Editor. This option gives you total control on the look, feel, navigation, features and everything else on your site.

Option #2: Building a Wix site using the Wix Editor

To see how the Wix Editor works, let’s take up the same digital marketing agency website example.

To create a new site, click on ‘Create New Site’ option from the ‘Site’ menu item:

As you click on it, Wix will again ask you for the type of site you want to build.

As you click on it, Wix will again ask you for the type of site you want to build.

As you click on it, Wix will again ask you for the type of site you want to build.

For this walkthrough too, we’ll choose the ‘Business’ website category.

For this walkthrough too, we’ll choose the ‘Business’ website category.

But this time, we’ll create the site with the Wix editor because we want to try the editor now.

As soon as you click on the ‘Start with Wix Editor’ button, you’ll be directed to various templates.

As you can see in the following image, in our case, Wix is already highlighting a bunch of relevant templates in the ‘Business’ category.

Not only that, there’s also a handy search option to filter out the right template (see all Wix’s design templates yourself here).

wix-edit-step-3

Let’s go with the ‘Advertising & Marketing’ sub-category because it looks like the most relevant one in our case..

For the template, let's select ‘Advertising and Marketing Firm’.

For the template, let’s select ‘Advertising and Marketing Firm’.

wix-edit-adi-step-5

Once you choose a template, you’ll see the full Wix Editor dashboard. You’ve 3 key areas inside the Wix dashboard (see highlighted sections): 1) The central part that you see in the above image is your website – and as you make changes, you can preview them in real time; 2) on your right, you’ve options that let you delete, duplicate, rotate and adjust the placement of the various elements on your site; and 3) on your left, it’s all your building blocks and design options are present.

We will take a detailed look into all elements in building blocks and design options.

1. Background

wix-edit-step-6

For a site’s background, Wix supports solid colors, images, and videos.

If you want to change the background color, all you need to do is click on the ‘Color’ option, and Wix will present a color palette. As you hover on any color from the palette, Wix will show you a real time preview.

If you prefer an image background, you can either upload your own image or choose from a collection of beautiful images that Wix offers for free.

Not only are the images beautiful but they’re also neatly stacked into categories.

Likewise, if you want to try a video background, again, you can either upload your own video or choose from one of Wix’s collection.

A free image library from Wix.

A free image library from Wix.

 

By making such premium media stock available to you, Wix really helps you build beautiful websites with beautiful images or media.

If you’ve ever tried recreating demos of most website builder templates, you might know how your designs fall flat when compared to the demos. This almost always happens because of lack of quality imagery. But Wix takes good care of you in this area.

2. Add

The ‘Add’ option lets you add design elements to your website. These elements include:

  • Text
  • Image
  • Gallery
  • Slideshow
  • Button
  • Box
  • Strip
  • Shape
  • Video
  • Music
  • Social
  • Contact
  • Menu
  • List
  • Lightbox
  • Blog
  • Sore
  • More

When you add any of these elements, you’ll realize that Wix has paid attention to the ‘little’ details.

For example, for our example website, I decided to add a CTA button to the main menu. So when I clicked on the button design element, Wix showed me several button styles and it also handpicked the styles that would go with my template. See the ‘Themed Buttons’ in the following image:

wix-edit-step-8

Another thing to note is that these design elements are completely customizable. In our example, the CTA button I placed in the menu looked a little out of place because of being slightly bigger and because the font didn’t match with the default menu font.

But there’s an easy fix for this. Simply clicking on an element opens its design toolbox. Once you click on the paintbrush icon, you’re presented with a host of customization options:

To match our CTA button with the rest of the menu, we could easily change its font as well as its size. This is enough to make the newly added element look like a part of the design.

wix-edit-step-9

If you compare these design tools to those from most other platforms like Squarespace, you’ll notice that there are 10’s of more elements with 100’s of styles and customization options for each. Wix has way more than what most other site builders offer.

3. App Market

The ‘Wix App market’ is a marketplace with lots of third-party and Wix apps that let you extend your site’s functionalities.

We will cover Wix App Market in detail later.

4. My Uploads

The ‘My Uploadssection in Wix is like a website’s gallery.

This section has all your files like the images, videos, audios, and other downloadables that you add to your site.

5. Start Blogging

If you’d like, you can add even more elements to this page. Just use the ‘Add Blog Elements’ option from the ‘Blog Manager’ menu:

wix-edit-step-10

The “Start Blogging” option – as the name suggests – lets you add a blog to your website.

As you click on the ‘Add Now’ button, a blog page gets added to your website. If you look at the blog page layout, you’ll notice that it has a (completely customizable) sidebar with useful options like search by tags, a featured post widget, and a recent posts widget.

As you click on the ‘Add Now’ button, a blog page gets added to your website. If you look at the blog page layout, you’ll notice that it has a (completely customizable) sidebar with useful options like search by tags, a featured post widget, and a recent posts widget.

You can add even more elements to this page. Just use the ‘Add Blog Elements’ option from the ‘Blog Manager’ menu.

You can add even more elements to this page. Just use the ‘Add Blog Elements’ option from the ‘Blog Manager’ menu.

The “Add Blog Elements” option lets you add different elements to your blog page like:

  • Disqus comments
  • Facebook comments
  • Custom feed
  • RSS
  • Categories
  • And a few more.

In addition to these elements, this section also recommends some Wix apps that can add more power to your blog.

Wix also pre-populates the blog page with dummy posts, so updating it with your content becomes much easier.

6. Bookings

The ‘Bookings’ option lets you add the booking functionality on your site. This can be helpful if you want to offer free consultation or if you take paid sessions.

So that covers all the options on the left panel as well the Wix editor in general. Let’s now see the main site settings in Wix.

Understanding Wix site settings

When you’re done with designing your website, you can access your site settings from the ‘Site’ menu option:

Under the ‘Site Manager’ settings, you have a host of options for your site’s SEO, social, analytics and more. We will go over each of these options.

Under the ‘Site Manager’ settings, you have a host of options for your site’s SEO, social, analytics and more.

We will go over each of these options.

We will go over each of these options.

 

  • Domain: The domain setting lets you connect your custom domain to your Wix website.
  • SEO: The SEO settings let you add custom tracking and other code to your website. You can add tracking code for Google Webmaster tools, Bing Webmaster Tools, Twitter Cards, Pinterest Verification and more*.
  • Mobile: This setting just ensures that you’re running a mobile-friendly website.
  • Language & Region: One great feature about Wix is that it helps you create local websites right out of the box. Under the ‘Language & Region’ setting, you can specify the language of your website.
  • Business Info: Under the ‘Business Info’ setting, you can add details like your business name, address, email and more.
  • Social: The ‘Social’ setting lets you add your Facebook profile with your site. (I’m really curious as to why just Facebook is included here!)
  • Analytics: Unlike some website builders, Wix doesn’t have its own visitor or site metrics tracking system. For tracking purposes, Wix integrates with Google Analytics. So you can add your Google Analytics script here.
  • Roles & Permissions: Wix allows you to add multiple users to your website. Wix supports different user roles like a blog contributor, editor, admin, etc.

With these settings, you’re now ready to launch your website. But there’s still one more thing left to discuss – the Wix App Market.

* Additional note on SEO settings:

A very interesting Wix SEO tool here is SEO Wiz. SEO Wiz helps sites with on-page SEO.

To start using this tool, click on the ‘Let’s Go’ button from the SEO panel option. When you start optimizing with the SEO Wiz tool, it will first ask for some business information. Once you provide it, you’re asked to input about 5 keywords that you’d like to optimize your website for. Just input your keywords and click on the ‘Create SEO Plan’ option. As soon as you do so, you’ll be presented with a checklist with steps to make your site search engine friendly.

To start using this tool, click on the ‘Let’s Go’ button from the SEO panel option. When you start optimizing with the SEO Wiz tool, it will first ask for some business information.
Once you provide it, you’re asked to input about 5 keywords that you’d like to optimize your website for. Just input your keywords and click on the ‘Create SEO Plan’ option. As soon as you do so, you’ll be presented with a checklist with steps to make your site search engine friendly.

Exploring the Wix App Market

The Wix App Market has apps for possibly all the functions you might ever need on your website. Whether you need to add a FAQ section or a simple live chat widget, the Wix App Market has you covered.

The Wix App Market has apps for possibly all the functions you might ever need on your website. Whether you need to add a FAQ section or a simple live chat widget, the Wix App Market has you covered.

If you just want to build a basic website, you’ll not need any additional apps because Wix covers almost all the features and functionality you might need.

However, there may be times when you need features that aren’t present in Wix right out of the box. Or, you might want to extend your website or marketing power to it. For all such times, just head to the Wix App Market.

The Wix App Market has apps for possibly all the functions you might ever need on your website. Whether you need to add a FAQ section or a simple live chat widget, the Wix App Market has you covered.

A lot of apps are free and some have premium versions too.

While the apps you add will depend on your needs, but I recommend adding the ‘Wix Get Subscribers’ app. You can use it to add signup forms and popups on your website and build an email list super-fast.

Wrapping it up

So that wraps up all you need to know about starting your website with Wix. You’ve learned about Wix ADI, the Wix editor, and the different site settings.

Hopefully, you’re now ready to build your first website with Wix.