October 2, 2022
 in 
Development

Editor X vs Wix - Key Differences That You Should Know

Editor X gives you absolute control over your design, making your website fluid as compared to the old technology from Wix.

Eric Phung

Fast forward to 2022, more than two years since its release, you are missing out if you don't know the key differences between Editor X and Wix.

Editor X is fluid, Wix is adaptive

If you have been using Wix since its genesis, you would notice that your design is pretty limited to the dashed lines on your Wix Editor. This is how Wix solves their web design problem, by providing you a visual limitation for the tablet view. If your elements are contained within these lines, your tablet breakpoint would look good.

Wix quickly solved this problem by providing you a way to break your design into smaller columns, in which each small column is still limited by two smaller dashed lines. It is indeed can scale for bigger screen sizes, but now your elements are really small and very far apart.

To make matter worse, you are also limited to what you can do with your mobile breakpoint, and there's not much you can do about it.

Introducing Editor X, an advanced web creation platform by Wix.

1. More Control Over Your Layout

There are 3 default breakpoints when you first created your new project - Desktop, tablet, and mobile.

You now have the modern day website design power to have absolute control over your design, no matter the screen sizes. Being fluid means, your elements can scale and adapt its position smoothly as you switch between screen sizes.

The primary technology that all web designers should follow is flex box and grid, in short, the box model.

Flexible Box Module is a one dimension layout model that was designed to provide greater control over alignment and space distribution between items within a container. In Editor X, you can enable flexbox by using the Repeater and Layouter elements.

Grid is a two dimension layout model that is very powerful to build your responsive layout. From your container, you can choose Add Grid and you will be presented with different settings that allow you to add more columns, rows, and manage the behaviours of each cell.

As you now have more control over your layout, you can build all kind of layouts without any limitation.

2. Make Your Text Fluid

Wix let you choose a fixed font size for your text elements, but that means you would have to change the text size as you scale down to tablet or mobile.

Editor X let you set a font size range, meaning your text size will scale up or down based on your screen sizes.

This makes more sense, because now you don't have to change your header font size from 56px on desktop to 32px on tablet, you can simply set the range from 32 to 56. Your text will scale fluidly.

3. Element Position

Has it ever occurred to you that you want the image to stay on the screen as you scroll on desktop, but acts normally on mobile?

Editor X gives you control over the element position including static, sticky, pinned.

The static position is the default position of every element on the canvas. The sticky element is what we are after in this example. You can change your image position property to sticky, give it top distance (maybe 10px), and it will stick to the top of your screen as you scroll down. You can play with this to produce the best layout for your use case. After that, you can go to the mobile breakpoint, select default position. Now the element will not be sticky, and you can start manipulating your layout so that it fits your mobile design.

What's Next?

At the end of the day, it is entirely up to you to choose the most suitable platform for your project. Wix is not going anywhere, but it's the capabilities that Editor X has to offer will make you think twice about the best way to go.

Not enough time to learn Editor X or having trouble with the breakpoints? Get in touch! We are Editor X Partner, and we love helping startups, SMEs, or even established businesses building their dream websites that work.