Wix is one of the most popular choices for building free websites. This is especially true for those of us who prefer something quick and easy to set up and won’t require hiring a web developer.
With Wix, it’s easy to have your own free website up and running in less than 30 minutes.
In this tutorial, I’ll be showing you exactly how I created this blogging site in Wix…
The site I’ll be creating is live. You can access it at any time by clicking here. And it didn’t cost me anything to set up because I’m using Wix’s own domain name for hosting (but more on that a bit later on).
Now the object of this tutorial is that you can follow along and create something very similar for your own site. This is a substantial tutorial, but you can skip ahead at any time using the time tags in the video or the subheadings in this article.
OK with that out of the way, let’s get started. And the first step is to create an account on Wix.
STEP 1
Create an account on Wix
To do this either Google ‘Wix’ or if you’re happy to use my affiliate link, Click Here.
Having clicked the link, you’ll land on a similar page to this and we’ll start by creating a new account.
Enter an email address and password and press Sign Up. We’re then taken through the first of several questions that Wix uses to ascertain the best experience for our needs.
So first up we’re asked whether we’re creating the website for ourselves or a client and, since it’s for us, we’ll choose ‘Get Started’.
We’re then asked to describe the type of website we’re creating. It is worth being as specific as possible here because Wix will recommend templates for our site based on the answer you provide.
We’re now given the opportunity to add features to our site. Since we said we’re creating a blog on the previous screen, the blog feature is already chosen by default, but you can also add other features such as discussion forums, chat boxes, and online stores.
For now though, I recommend keeping things very simple and unticking everything except the blog. Finally, we’re asked whether this is our first attempt at creating a website. And since it is, I’ll click here.
We’re now getting into the nuts and bolts of the setup process. And the first real decision to make is whether to create your blog using the WIX ADI – Wix’s Artificial Design Intelligence platform – or edit one of Wix’s existing templates using the main Editor.
STEP 2
Set up the site using Wix ADI editor
Now, this is where I differ from many of the other Wix tutorials on YouTube.
The aim of the ADI platform is to take the complexity out of the website creation process and, in all honesty, as a beginner, this is the option I would choose.
Other tutorials recommend going straight to using the Wix Editor and editing one of the many templates that are available.
However, I don’t recommend taking this approach because many of the templates available on Wix are not suited to creating a simple blogging site. They’re more appropriate for creating an online shop or a website for an established business.
And whilst Wix will direct you to their blogging templates, some of which look really great, if we take a closer look, you’ll see that they include many features you’re unlikely to use as a startup blogger.
Take for example this one, which uses a nice full-width background image.
If we look at the menu along the top, you can see it includes a discussion forum, a members area, and down the bottom here we have a live chat box, all of which will be superfluous to you when getting started.
If you were to choose a template like this, your first job would be to remove all of the features you don’t need. And all this extra work will likely result in confusion, frustration, and potential problems down the road.
Once you’re up and running and found your feet, you can add all these features at any point and switch to using the main Editor, but for now, I recommend using ADI, so we’ll click on Start Now and the first step is to give our Website a name.
Having entered your name into ADI, if you have an existing website you’re transitioning from, you can enter the details here, and if you run an office, you can locate it using Google Places.
On this next screen, you can add a few more details about your business. The information you provide here will be displayed publicly on your website, so I wouldn’t recommend using your personal details.
This is more for if your business has its own office. Likewise, if you signed up to Wix using a personal email address I would recommend creating a separate address for your business and using it here.
A simple Gmail account will suffice for now. All these details are optional so feel free to leave them blank. The next few steps differ depending on whether you have a logo or not. I suspect you won’t, but for the purposes of this demonstration, I’ll show you both scenarios.
Having added a logo, Wix will use the colors in your logo to create a color palette for your site and will use these colors to recommend three different templates for your blog. Your logo, social media, and other details will all be automatically added to the template.
If you don’t add a logo, Wix will instead offer you a few different font and color options. The aim is to choose a font and color combination that appeals most to you.
The options here aren’t great so don’t fret over this too much as there are more themes available in the ADI editor and you’ll be able to switch themes until you’ve found one you like. However, for now, I’ll keep everything simple and choose Minimal.
We’re then provided with three homepage designs for our blog. You can see because we didn’t provide a logo, Wix uses the title of our site instead, which I think often works better anyway.
Again, you can alter the template later to suit your tastes, so don’t fret over this too much but choose one that has the most sections which appeal to you.
For example, I like the the full size image of this design and the contact form at the bottom. The picture of the drone doesn’t really reflect the content I’ll be writing, but I can easily change the image later so I’ll go with this one.
The final step is to add additional pages to your site. As before, you can add pages later, so don’t worry if you’re not sure.
To be honest, if you’re starting from scratch, you probably have very little content anyway, so I’d hold off adding any more pages until later. Click on Edit Site to finish the setup process and your site will open in the ADI editor.
STEP 3
Become familiar with the Wix dashboard and menus
Before we jump into amending the design and creating blog posts, here’s a quick overview of the Wix workspace and menus.
Here we are in the editor but when you close out of Wix and log in again, you probably won’t automatically see this screen.
What you’ll likely see is your Dashboard. Your Dashboard is an overview of your site and is where you can manage the administration of your site.
Here you can do things like giving people access and permissions to edit your website on your behalf. You can create a mailbox for your site to receive email and you can also purchase your own domain name, which will require you to sign up to one of Wix’s paid plans.
In the site actions menu, you can do things like changing the name of your site, duplicate it, or delete it completely if you’re not happy with it. Duplicating your site is often useful for testing any changes you wish to make to your main website.
Clicking on Edit Site will take you back into the editor.
Selecting Blog in the left-hand menu will display all the blog posts you’ve created. Currently, there are 3 dummy posts to give you an idea of your site’s layout, but this is where we’ll go to start posting our own articles, once we’re finished with the design.
Finally, in this section are your account options. Here you change your email address, password, and if you sign up for a paid plan, you can also view your billing details here.
If we jump back into the Editor, let’s have a look at the other menus available.
Along the top is the main menu. Working from left to right, the first option you have shows you the current page you are editing and allows you to switch between pages, should you wish to edit a different page.
At the moment, our website only consists of the main Home page and below that is Posts, which – if we click on it – allows us to edit how each post or article will be displayed on our site.
Posts are not typical pages, not like the Home page or an About page. Posts are not typically added to menus for instance, which is why it is shown as indented under the main page in this menu.
Next to the Home Page is a settings wheel with additional options and above it is where you can edit your main navigation menu.
If we had additional pages, we could add them to the menu by clicking this blue button and we can do things like hide or rename menu items by clicking on the ellipsis icon next to each one.
For example, if I wanted to refer to my posts as Articles rather than posts, I’d simply choose rename like so, and you’ll notice the menu updates accordingly.
The next main menu item is Add where you can add a section to the existing page, a whole new page entirely, or add new features such as a Members area, which are listed under Apps.
If I wanted to add an About section to give my readers a bit of background, I would click Add Section to Page, choose “About” followed by a design I like from the options available, then I would simply drag it to my Home page like so.
If you had a lot to write you may prefer to create a whole About page rather than just a section. In this case, delete the section by clicking on the ellipsis icon for the section and choosing delete.
Then choose Add page and Wix provides multiple options and designs based on the type of page you wish to add.
Notice how we are now editing the About page rather than the Home page, and how the menu has automatically updated to display our two pages, rather than sections that it displayed previously.
My preference is to have an About section rather than a whole page, so I’ll delete the About page and re-add the About Section as I did before. Alternatively, I could have simply clicked Undo several times in the main menu to reverse the changes I made.
The Design menu option is where you can change the theme of your website, which will change both the fonts and the colors used across your site. Here you can see you have a lot more variety than the six choices shown during the setup process.
If you rather not change the whole theme but just the font or the color palette you can select these individually from the Design menu too.
Finally, for this menu item, you can add text animations to some of the main headings. Hover over each animation to see how they work. Fly is my favorite so I’ll select it like so.
Manage is another way of installing apps and accessing the Apps you have already, which in this case is our Blog. Once finished in an App you can get back to the editor by clicking on the X.
As already mentioned, next to the Manage menu are the options to undo, redo any changes you’ve made. And you don’t need to worry about Save, since Wix auto saves your work as your go.
The next menu is one of the most important and that is switching between the Desktop and Mobile view of your site.
Since most of your readers will be viewing your site on mobile, it’s imperative to continually check the layout is correct in both viewports.
Note that in mobile view, images will be cropped in from left and right, and paragraphs of text will appear longer and therefore less easy to read. It’s also worth noting that changes made to the layout in the Desktop view affect the layout in mobile view but not vice versa.
So you can adjust things for mobile without ruining the look and layout of your desktop site. I’ll demonstrate that a bit later.
Next on the menu is Help, which is pretty self-explanatory and then we have Site, which is how you can access your Dashboard and other main settings.
If you have more than one site in Wix, you can switch to it by clicking on My Sites and, if you prefer to use Wix’s main editor over ADI, you can access it here.
The bell will display any notifications, if you have them, and click on upgrade to switch to one of Wix’s paid plans. Preview allows you to preview how your website looks before actually going live, which you would do by clicking Publish.
So that is a look at the Dashboard and Main menu in ADI. Now, lets gets started on the fun stuff of editing our website.
STEP 4
Edit the website
Now we can get into the fun stuff of changing the look and feel of our website to our preferred design.
We’ve already looked at how to add additional sections and pages, and how to switch between pages. Editing the design and layout of a page is the same regardless of which page you are working on.
Each page is split into sections, and you edit each section by hovering over it. The section will be highlighted in blue and some options will appear.
The options available depend on the section you are editing, so if I hover over the Header section, for example, you can see I have the options to Edit or Design.
Whereas if I hover over the banner image, I have an additional ellipsis menu and the option to move the whole section down the page.
To start, I want to center my title and menu and change the banner image to something that better reflects the content of my site. Simply clicking on the section will display the edit menu and here you can add and remove elements such as a Tag Line or a Logo.
Once you have a logo for your site you can click Settings to replace the dummy image. This image manager window will open whenever you’re adding or amending an image in Wix.
Here you can browse through Wix’s own free media gallery or Shutterstock images which you’ll have to pay for. Since my logo is saved to my computer I’ll click Upload Media and Upload from Computer.
Having uploaded an image, Wix has several tools for adjusting the image and removing the background.
When you’re happy, click Apply. After adding an image you should get into the habit of providing Alt Text, which is a short description of what the image represents. This is useful for people visiting your site who are visually impaired and it improves your site’s SEO performance.
Having added my logo, I can then change the layout of my header section by clicking on Section Design, and here I’ll choose this alternate layout which will center the title and menu.
Next, I want to replace the image of the drone with something more appropriate. Again click on the section to bring up the different settings and I’ll start by removing the Subtitle and then, as before, I’ll click on Settings to replace the image.
This time I’ll replace the image with another from Wix. As you can see, Wix recommends some alternatives but, if you don’t like these suggestions, you can simply search the catalog.
I’ll go with a photo which has a variety of gadgets. I also want to change the text to read Welcome To “The” Faculty of Apps, which I can simply amend. And I think I’ll bold Faculty of Apps so it stands out. And maybe just increase the spacing a little.
Finally, for this section, I want to adjust the height of the section slightly, which I can do by clicking on the ellipsis icon. Then it’s just a matter of clicking on the plus and minus signs to change the size as per your preference.
Moving onto the Posts section there are a couple of changes I’d like to make here.
Firstly, I’d like to change the layout of the post grid. To do this hover over the Section, choose Design and select a layout (I’ll go with the second layout).
Now if I click on the Elipsis icon I can change what is displayed for each post. I want to remove the Login Button since there isn’t a members section on my site and therefore no need to log in.
If you notice the Author’s name is currently using the account name Wix gave me when I signed up. We can change this later when we start creating our own blog posts.
Next up there is a button in my About section that I wish to link to the Contact Me section below it. Again click on the section to bring up the settings menu. Here you can change the title and description and choose which elements you wish to display.
However, I want to link the button to the Contact me section. Adding a link to a button is the same as creating a text link. You can link to a variety of different sources, including external URLs, documents, and an email address. And to link to a page or a section of a page, choose Page.
Select the page you wish to link to followed by the section, and then click Done. You can test the link works by Previewing your site. If the link is working correctly it should scroll nicely to the next section.
Now there are a couple of changes I’d also like to make to the Contact Me section. I don’t want to display my address, phone number, or the map below.
And I also want to remove the phone number, address, and subject lines from the form fields since I don’t need that information and it’s unlikely anyone will want to provide it anyway.
Clicking on the Section, I’ll untick the Address field and phone number and then I’ll choose Edit to amend the form. And it’s just a matter of deleting the fields I don’t need. I’ll also remove the titles since it’s already pretty self-explanatory.
To finish up I just need to remove the Map.
That completes the Contact section. You’ll notice in the footer I have social media links to Facebook, Twitter, and LinkedIn which I don’t use.
If you had a Facebook page to accompany your website, you could just edit the URL by clicking on the pencil icon, but since I don’t have any of these I’ll simply untick them all.
I do, however, have an Instagram account which I’ll add at the bottom here and you’ll see Wix automatically updates the footer with the Instagram logo.
That pretty much completes the editing process and now I can preview the design to see how it looks on both desktop and mobile.
Now I’m not happy with how the text sits above the banner image on the mobile site, so I’ll go back and edit this. Remember, layout changes made in the mobile view do not affect the desktop view, so I can change the banner image section and if I switch back to the desktop view, nothing has been altered.
So that completes the website setup. Now we’ll start writing some blog posts.
STEP 5
Writing blog posts
If you’re in the editor, you can access your blogging features by clicking on Manage and Blog, but my preference is to come out of the editor completely and open the Dashboard.
Here on the left menu, we have Blog where we can see the dummy blog articles created by Wix. To delete these, click on the ellipsis icon next to each one and choose Move To Trash.
To create your first post, click on Get Started. This opens the blog post editor, which is much the same as any basic text editor with a menu at the top with the standard text formatting options.
I’ll use a post from the Faculty of Apps site, which I’ll copy and paste into the editor. I’ll also add a title, and further down the article I’ll add an image.
Add a new element to your website by clicking on the plus icon. Here you have several different elements you can add to your post including dividers and tables, but I’ll click on Image.
As before, when we were editing the website, this will open the Wix image manager window and I’ll add an image I have saved on my computer.
Once loaded, click Add to Page. I can also add the YouTube video I created to accompany the article. To do this, I’ll quickly switch over to YouTube and copy the URL.
As before, click on the plus button where you want to add your element, and this time we’ll choose video and paste the URL into the space provided.
And there we have it, my first post including a video and photos.
Before publishing your article, it’s worth going through some of the settings in the left-hand menu.
Firstly, is the Settings option where you can add a feature image. This will be the image displayed in the Post Grid on your home page.
Just as before, select one using the Wix Image manager. Here is where you can also change the Author name to something other than your account username. Add a New Author, and enter a name. If you have a profile picture you can add one here too.
In the advanced settings, you can add a description that may get displayed in the post grid depending on the layout you have chosen. If you don’t write a description, Wix will use the first paragraph from your article. And If you’d rather not allow comments on your post you can disable them here too.
Next are your SEO settings, which will be displayed by Search Engines, such as Google and Bing. If you don’t want your articles to appear in Search Engines results disable this option, but bear in mind this is how most people will find your site.
As you increase the number of articles on your site, you may wish to start grouping them by category. But I wouldn’t worry until you have at least 20 or 30 articles. Finally, monetization is only possible if you sign up for one of Wix’s premium plans.
If you have published your website, you can preview your post by clicking the preview button.
You can publish it immediately, or you can save it as a Draft, or schedule the post to be published at a later date, should you keep a publishing schedule that your readers are used to.
Having published my blog post, the final step is to publish the entire site and go live. Click on the button to return to the Editor.
Back in the editor, we’ll now see our post in the Post Grid.
Once you’re happy with everything on your site, the last step is to hit publish.
Now, since I am not using one of Wix’s paid plans, my website uses a domain name provided by Wix.
http://wilsoncrusoe.wixsite.com/facultyofapps
You can change the ending of the name to reflect the name of your site, but ideally, if you are hoping to build a business around this site, you should consider using a custom domain name that represents your business and your brand.
For more information on how to upgrade your Wix website and apply your own domain name, you may be interested in this video…
Signing up for one of Wix’s paid plans comes with a free domain name, so that’s something worth considering. Alternatively, if you’re happy using a Wix domain name, hit Publish and continue to view your live site.
If you’d like to find out more about monetizing your Wix website, then take a look at this…
And that completes this tutorial on how to create a free blog website on Wix. For more tips like this, please check out my Youtube channel. See you there!
