top of page
T1 start

Get Started with Wix Editor

When you create a new site, you can choose if you want to build it using Wix ADI (Artificial Design Intelligence) or Wix Editor.

​

ADI: Let Wix ADI Create a Website for You
 

Answer a few questions to get started! Wix ADI uses this information to automatically create a unique website for you by combining the best content and design elements. Once your site is ready, you can add your own images, customize the text, and more.  

​

Editor: Get Started with One of Our Stunning Templates

​

Choose from one of our stunning templates and customize it the way you want. You can drag and drop elements such as text boxes, shapes, images and more.

​

In general, Wix Editor supports the following features which are not available under Wix ADI:

​

  • HTML code element

  • Embed a site element

  • PayPal buttons

  • Music players

  • Documents

  • Webmaster and Member login buttons

  • Wix Hotels

  • Wix Restaurants

  • Wix Photo Albums

  • Apps from the App Market (Wix ADI only supports 4 apps: Wix Chat, Wix Blog, Wix Booking and Wix Stores)

 
(Note: Not all the above functions are available under the "Unlimited" plan subscribed by ITS.) 

​

If you are looking for a more feature-rich website and a basic "canned" website may not fit your needs, Wix Editor is a good choice for you.  It can deliver a more than "customized" website if you can spend more time in setting it up.

​

To use the Wix Editor, please familiarize yourself with the Wix Editor interface.  Through this interface, you can design the header/body/footer, add new pages, manage the page menu, configure the website domain name, set SEO (Search Engine Optimization) and website statistic tool to boost the visiting frequency of a website.  Convenient tools such as site history and duplicate site are available handily.  The website can be further enriched by using Wix Code and Wix App Market.

  1.Go to Dashboard.

  2.Click Create New Site.

  3.Click Use Wix Editor

wix-editor_edited.jpg

Wix Editor Interface

T1 Wix Editor Interface
interface1.JPG

Related Guide:

Header

T2 header

Header Design

T2 Change Header Design

  1.Click Change Header Design

header4.jpg

  2. Choose a preset design or Click Customize Design

header5.JPG

  3. Choose a design and edit the style under the selected design.​

header.jpg

Related Guide:

Menu Design

T2 Menu Design

  1. Menu will be displayed at the header by default.  You can click Add button (the third icon) on the left menu and Menu to add a menu

menu1.JPG

  2. You can edit the Menu layout and design.

menu.jpg

Related Guide:

Upload Image as Logo

T2 Upload Logo

  1. ​Click Add button (the third icon) on the left menu.  Then click Image and My Image Uploads.

header6.jpg

  2. Click Upload Images and select an image from your PC.

  3. Click Add to Page.

  4. Drag the uploaded image to the preferred Header area and stop until you see the Attach to Header button.

header1.JPG

Related Guide:

Body

T3 body

Strip

T3 Add Strip

Strips are blocks holding elements such as images or texts.  Contents in the blocks can be moved easily.

Add Strips to page:

​

  1. Click Add button (the third icon) on the left menu.

  2. Click Strip.

  3. Select and click the preferred Strip design. 

strip8.JPG

​Move Strips:

​

  1. Click Zoom out icon.

strip7.jpg

  2. click Move up / Move down arrows to reorder the contents.

strip2.jpg

Related Guide:

Edit Background

T3 Edit Background

Edit Pages Background:
 

  1. Click Background (the second icon) on the left menu.

  2. Choose Color, Image or Video. You can also upload your own image or video.

  3. Click Settings if you wish to change the style of the image or video.

Edit Strips Background:

​

If you have added a Strip, you can edit its background by the following steps: 

​

  1. Click the Strip added.

  2. Click Change Strip Background.

strip9.JPG

  3. Choose Color, Image or Video. You can also upload your own image or video.

  4. Click Settings if you wish to change the style of the image or video.

strip10.JPG
str8.png

Related Guide:

Slideshow / Banner

T3 Add Slideshow/Banner

You can add slideshow to promote your site or event.

​

  1. Click Add button (the third icon) on the left menu.

  2. Click Interactive.

  3. Click a slideshow to add.

You can add Title here

and have description here

Related Guide:

Text, Button, Image and Box

T3 Add text, button, image and box

You can add Text, Button, Image (max.15MB), document (max.15MB) and video (max. 250MB) using the options under Add button (the third icon) on the left menu.  You can consider using Box to include these elements which can facilitate editing such as moving and alignment.  

text2.jpg

How to Add, Edit, Customize & Link Text

How to Add, Link & Customize Button

How to Add, Upload, Customize & Link Image

Related Guide:

Lists and Grids

T3 Lists & Grids / Repeater

List and Grids include Repeater and Table.

repeater2.JPG

Repeaters help you reduce the works in aligning and editing items that share the same design in background, images, text, shapes and buttons. You however cannot put repeaters inside repeaters.

​

Repeaters can display Dynamic Data. Click here to see how it works.

repeater4.jpg

Data in a table has to be stored using a Wix Database.  Table cannot be created by simply inputting the data in a table such as that in MS Word.

​

By connecting to a Wix database, you can display dynamic data and define the action upon clicking a row or a cell.  Click here to see how it works.

Title
ReleaseDate
details
image
Customize Your Website's Quick Action Bar
01/09/2018

Now there are new icons to choose from! Look good while making it easy for visitors to contact you from their mobile devices. 

​

checkout details: https://support.wix.com/en/article/adding-and-setting-up-the-quick-action-bar-on-your-mobile-site

Wix Editor: Better Experience Adding User Input Elements
03/09/2018

To make it easier for you to find what you're looking for, we've added sub-navigation to the User Input elements in the Add panel.

Here's where to find it: 
1. Go to the Wix Editor 
2. Click Code and Turn on Developer Tools
3. Click Add and User Input

Wix ADI: Image Opacity
15/09/2018

Creating your website with Wix ADI? Now you can control the opacity of your background, strip and column images. 

Here's how: 
Hover over the image and select Customize. Under Media Layout, you'll see the Image Opacity toggle.

The New Wix Mobile App Is Now Available
15/09/2018

Get a better experience managing your website and business on the go. 
Available in the Apple App Store (iOS) and Google Play Store (Android).

- Manage your Wix website
Get notifications, view all your messages, instantly send responses, start a live chat and more.
- Add & upload pictures
Take photos on your phone and upload them straight to your website's image library.
- Manage your store
Track orders, add new products and get notified about sales and when you're out of stock.
- Keep track of your bookings
Add services & appointments, check in clients and get instant notifications & reminders.
- Manage your blog
Manage your blog posts and share your latest content with subscribers.
- Create events
Invite guests, send invitations and let people RSVP or buy tickets from their phones. 

The Wix Mobile App is both for you, the website owner, and your customers. Simply invite people to become members. Members can chat you, book a service, RSVP to an event, start a discussion and more.

Wix Code: Add User Input Elements Inside Repeaters
23/09/2018

Now you can add user input elements—like Date Picker, Input, Dropdown, and Checkbox—inside a repeater.

Wix Code: Bind Dropdown Values to a Reference Field
27/09/2018

This automatically sets the labels in the dropdown element to the items from the referenced collection.

checkout details at:

https://support.wix.com/en/article/wix-code-about-labels-and-values-for-radio-buttons-and-dropdown-lists

Wix Editor: The Layers Panel Is Now Available
01/10/2018

Now you can work with overlapping elements in the Editor—without touching the design. 
check out details steps at https://support.wix.com/en/article/wix-code-working-with-the-layers-panel

Settings Has Been Reorganized
03/10/2018

Log in to Wix and click Settings. 

Here are the biggest changes: 
- Settings & Manage Website have been merged into one
- Go to General Info to customize your favicon
- Go to Overview to manage your general info, SSL certificate and roles & permissions

Related Guide:

Footer

T4 footer

Contact Us

T4 Add Contact us

You can add a Contact Tool to enable visitors to send you their contact information and question.  Map showing a contact location can also be added using this tool.  

contact.JPG

​To add a contact form:

​

  1. Click Add button (the third icon) on the left menu and select Contact.

  2. Select the tool you wish to add. 

  3. Click ​Manage Fields to edit fields. 
  4. Click the + Add New Field button to add more fields such as Name, Email, Phone No. and Subject.  You can also add a field with a customized name.
  5. Click Make Mandatory if the field is a compulsory.
contact2.jpg

  6. Click Setting icon (the gear button) to change the receiver email for this contact form.

contact4.jpg

To add a map:

​

  1. Select the map you wish to add e.g. Google Map

  2. Click Settings icon (the gear button) to set the location and other map details.

map4.jpg

  3. Click Design icon (the pen icon) to change the map design.

map5.jpg

Related Guide:

Social Tool

T4 Add Social tool

  1. Click Add button (the third icon) on the left menu and select Social.

social.JPG

  2. After making a selection, click Set Social Links to edit link or add new social icon.

social1.JPG
social2.JPG

Related Guide:

Page

T5 page

Page / Anchor

T5 Add Page / Anchor

Add page:

​

Click Add Page to add a new page with header and footer or a blank page under the Menu bar.

page2.jpg

Use anchor to point to a specific location in a page. (HOW??)

Please note that Folder is different from Page or Anchor.  Clicking Folder will not show any contents. 

​

Below gives an example.  Clicking the Page button will link to the designated web page while clicking the Folder button will give no response.

Folder
page8.JPG

Related Guide:

Dynamic Page

T5 dynamic page

Dynamic page is an advanced function.  By making use of a Database, pages in the same layout can display the predefined records under the Database dymanically.  

  1. Turn on Developer Tools under Code at the top menu.

code1.JPG

  2. A new option Dynamic Pages will appear under Menus & Pages on the left menu.

  3. Set up database collection based on your needs.

dynamic1.JPG

Related Guide:

Wix Code

wix code

Wix Code is an innovative new product that lets you build robust web applications with all of the stunning visual features of the Wix Editor. 

​

This is an advanced feature of Wix that requires some programming knowledge.  It will be used when setting up Database and Dynamic Page.

Related Guide:

Wix App Market

Wix app market

The Wix App Market is filled with over 250 popular web apps, powerful services and amazing features to enhance your website and grow your business. Most of the apps are free to use, mobile optimized and easy to add to your site in just a few clicks.

Related Guide:

bottom of page