8A356F71-DA6E-4345-B1E7-E401AE4EE163 Created with sketchtool. 9BF07BAC-BC2E-400B-A0CC-69A823F8C48C Created with sketchtool. Email-Icon Created with Sketch. Group 3 Created with Sketch. Domains-SVG-Box Created with Sketch. Domains-SVG-Box Created with Sketch. Domains-SVG-Box Created with Sketch. hosting 2 Created with Sketch. hosting Created with Sketch. Icon-Internet Created with Sketch. Hosting-SVG-Box Created with Sketch. Icon-Internet Created with Sketch. Icon-Internet Created with Sketch. Hosting-SVG-Box Created with Sketch. Hosting-SVG-Box Created with Sketch. Trustpilot-stars Created with Sketch. Trust Pilot Stars Created with Sketch. 1-5-million Created with Sketch. svg-CP Created with Sketch. Control-panel-Icon Created with Sketch. wsb Created with Sketch. WSB-Brush Created with Sketch. wsb 2 Created with Sketch. Email-Icon Created with Sketch. Email-Icon Created with Sketch. Email-Icon Created with Sketch. Email-Icon Created with Sketch. Icon-ECommerce-Seperator Created with Sketch. Icon-ECommerce-Seperator Created with Sketch. Icon-ECommerce-Seperator Created with Sketch. wp Created with Sketch. wp 2 Created with Sketch. icon-slider-next Created with Sketch. icon-slider-prev Created with Sketch. svg-webmail Created with Sketch. Webmail-icon Created with Sketch. heart Created with Sketch. Menu Created with Sketch. Open-24-7 Created with Sketch. 247 Created with Sketch. open24 Created with Sketch. 24 7 trusted Created with Sketch. Fill 1 Created with Sketch.

Website - News

Exercise your creativity with the new version of Web Editor

Written Sep 30, 2014 Category: Website

We're pleased to introduce new features in Web Editor specifically designed to make your workflow better.

All customers now get the new version of Web Editor, which makes it even easier to adjust and design pages. The Properties panel is simplified and new components added, but the biggest change lies in the design freedom on the site.

Check out these videos with tips and tricks for designing pages with the new Web Editor.


Tip 1 - Use the space adjuster
Tip 2 - Use the guiding lines
Tip 3 - Add text and images on top of existing elements
Tip 4 - Wrap text around your images
Tip 5 - Place elements on different layers
Tip 6 - Use the red squares to find overlapping elements



Tip 1 - Use the space adjuster


The space adjuster are two horizontal grey lines, placed above and under the component you select on your workspace. Just drag the lines to expand or decrease the area of your component.

By adjusting these lines for the background component, you can move several elements at once.




See how you can use the grey space adjuster to make room for new components.




Tip 2 - Use the guiding lines


The guiding lines help you position images and elements precisely. They appear automatically as dashed lines when you start moving a component on your work space. Use them to perfectly align images or other components on the website you are making.

And no worries, the guiding lines will not show on your published website.






Tip 3 - Add text and images on top of existing elements


You can easily add text and images on top of each other. Just drag new components to your workspace, and use the guiding lines to align them.







Tip 4 - Wrap text around your images


See how you can wrap text around images. Simply add the background component, and use it to control the wrapping.






Tip 5 - Place elements on different layers


In Web Editor you can place components on different layers. You can quickly change the component's position by clicking the Change depth icon.

Choose between the options: Move to front, Move forward, Move backward and Move to back.






Tip 6 - Use the red squares to find overlapping elements


The transparent red square, tells you that there are overlapping elements. Remember that the red square is just a helper while you are working, and will not be published on your website.