ARE YOU READY FOR IT? (teaser)
ARE YOU READY FOR IT? (teaser)
We're taking WYSIWYG Web Builder to the next level!
More than 200 new features and thousands of improvements to make your favorite web design tool easier, faster and even more powerful.
In this post we will give you a sneak peak at some of the new features.
This topic will be regularly updated with new information, so make sure you don't miss anything...
The next version of WYSIWYG Web Builder is planned for later this year.
The exact release date is unknown at this time. But we tell you more as soon as we know more!
*** Special Offer ***
If you buy version 14 today you will get version 15 for free when it becomes available!
This offer is also valid for all licenses purchased within 90 days before the official release date.
New users will now get a 25% discount, so you pay $44.95 instead of the regular $59.95
http://www.wysiwygwebbuilder.com/purchase.html
Registered users of WYSIWYG Web Builder will get a 50% discount when upgrading to the new version in the first few weeks after the release.
More details are coming soon!
More than 200 new features and thousands of improvements to make your favorite web design tool easier, faster and even more powerful.
In this post we will give you a sneak peak at some of the new features.
This topic will be regularly updated with new information, so make sure you don't miss anything...
The next version of WYSIWYG Web Builder is planned for later this year.
The exact release date is unknown at this time. But we tell you more as soon as we know more!
*** Special Offer ***
If you buy version 14 today you will get version 15 for free when it becomes available!
This offer is also valid for all licenses purchased within 90 days before the official release date.
New users will now get a 25% discount, so you pay $44.95 instead of the regular $59.95
http://www.wysiwygwebbuilder.com/purchase.html
Registered users of WYSIWYG Web Builder will get a 50% discount when upgrading to the new version in the first few weeks after the release.
More details are coming soon!
Direct2D rendering
Direct2D rendering
The graphics engine for workspace rendering has been completely redesigned using hardware acceleration (direct 2d), for better performance and higher quality graphics during design time. This means rendering should be much faster and the graphics will be sharper even when zooming in/out.
The graphics engine for workspace rendering has been completely redesigned using hardware acceleration (direct 2d), for better performance and higher quality graphics during design time. This means rendering should be much faster and the graphics will be sharper even when zooming in/out.
Shape Dividers
Shape Dividers
Last year, we released the experimental ‘divider’ template, which turned out to be the most downloaded template to date. So, this year we decided to make it a standard feature! The new shape divider option is available for layers, layout grids and flex box containers. Shape dividers are SVG based shapes that can be used to separate the sections of a page.
There are more than 30 shapes you can choose from, but you can also add custom shape SVG files. Shapes dividers can be added at the top or bottom (or both) of a layer.
The color specifies the color of the shape. The width specifies the width in percentages, this can be useful if you only want to display a smaller part of the shape, for example 200%, clips the left and right part of the shape. The height is in pixels. Shapes can be flipped horizontally/vertically. This makes it possible to use shapes that were designed to be used at the top, also at the bottom (flip vertically). The arrangement property controls whether the shape will be displayed underneath the content or on top of content.
Demo:
https://www.wysiwygwebbuilder.com/suppo ... -demo.html
Tutorial (preview):
https://www.wysiwygwebbuilder.com/shape_dividers.html
Last year, we released the experimental ‘divider’ template, which turned out to be the most downloaded template to date. So, this year we decided to make it a standard feature! The new shape divider option is available for layers, layout grids and flex box containers. Shape dividers are SVG based shapes that can be used to separate the sections of a page.
There are more than 30 shapes you can choose from, but you can also add custom shape SVG files. Shapes dividers can be added at the top or bottom (or both) of a layer.
The color specifies the color of the shape. The width specifies the width in percentages, this can be useful if you only want to display a smaller part of the shape, for example 200%, clips the left and right part of the shape. The height is in pixels. Shapes can be flipped horizontally/vertically. This makes it possible to use shapes that were designed to be used at the top, also at the bottom (flip vertically). The arrangement property controls whether the shape will be displayed underneath the content or on top of content.
Demo:
https://www.wysiwygwebbuilder.com/suppo ... -demo.html
Tutorial (preview):
https://www.wysiwygwebbuilder.com/shape_dividers.html
Unsplash Integration
Unsplash Integration
Browse thousands of free-to-use, high quality images from Unsplash directly within WYSIWYG Web Builder.

Browse thousands of free-to-use, high quality images from Unsplash directly within WYSIWYG Web Builder.

Preloader
Preloader
Added the ability to add an animated preloader image to the page (in Page Properties). A preloader (also known as loading screen) is what you see on some sites before the main content of the web page is loaded.



Preloaders are simple (GIF) animations that are used to keep visitors entertained while server operations finish processing.
WYSIWYG Web Builder can display a (semitransparent) overlay with animated gif when the website loading is in progress. It will disappear right after the page loads.
Demo:
https://www.wysiwygwebbuilder.com/suppo ... oader.html
Tutorial (preview):
https://www.wysiwygwebbuilder.com/preloader.html
Added the ability to add an animated preloader image to the page (in Page Properties). A preloader (also known as loading screen) is what you see on some sites before the main content of the web page is loaded.



Preloaders are simple (GIF) animations that are used to keep visitors entertained while server operations finish processing.
WYSIWYG Web Builder can display a (semitransparent) overlay with animated gif when the website loading is in progress. It will disappear right after the page loads.
Demo:
https://www.wysiwygwebbuilder.com/suppo ... oader.html
Tutorial (preview):
https://www.wysiwygwebbuilder.com/preloader.html
SVG Path Animation
SVG Path Animation
This adds the ability to animate the border (stroke) of SVG shapes, textart, clipart and makes it look like the shape/text is drawn on the web page in real-time;)
For complex shapes (with sub paths), it is possible to delay the rendering of sub paths for even cooler effects.


Tutorial (preview):
https://www.wysiwygwebbuilder.com/svg_animations.html
This adds the ability to animate the border (stroke) of SVG shapes, textart, clipart and makes it look like the shape/text is drawn on the web page in real-time;)
For complex shapes (with sub paths), it is possible to delay the rendering of sub paths for even cooler effects.


Tutorial (preview):
https://www.wysiwygwebbuilder.com/svg_animations.html
Toasts
Toasts
Toasts are lightweight notifications designed to mimic the push notifications that have been popularized by mobile and desktop operating systems. They can be displayed at page load or with delay. Multiple Toasts will automatically stack vertically.

Tutorial (preview):
https://www.wysiwygwebbuilder.com/toasts.html
Toasts are lightweight notifications designed to mimic the push notifications that have been popularized by mobile and desktop operating systems. They can be displayed at page load or with delay. Multiple Toasts will automatically stack vertically.

Tutorial (preview):
https://www.wysiwygwebbuilder.com/toasts.html
FlipSwitch
FlipSwitch
A "Flip Switch" (also known as Toggle switch) can be used as alternative for a checkbox. Inspired by the iPhone checkbox. It is possible to use different colors (text/background/border) for checked/unchecked, add animations, conditions and events.

Demo:
https://www.wysiwygwebbuilder.com/suppo ... witch.html
A "Flip Switch" (also known as Toggle switch) can be used as alternative for a checkbox. Inspired by the iPhone checkbox. It is possible to use different colors (text/background/border) for checked/unchecked, add animations, conditions and events.

Demo:
https://www.wysiwygwebbuilder.com/suppo ... witch.html
Wrap Text
Wrap Text
Added support for floating layout, so the 'Wrap Text' can also be used inside a layout grid. This makes it possible to wrap text around images or other objects. Child elements can either float left or right.

Also, added experimental support for CSS's shape-outside. This will wrap the text around the outline of a (transparent) image or shape, making it possible to wrap text around complex objects rather than simple rectangular boxes. Note that this will only work in modern browsers (Safari, Chrome, FireFox, not in IE or Edge!)


Tutorial (preview):
https://www.wysiwygwebbuilder.com/wrap_text.html
Added support for floating layout, so the 'Wrap Text' can also be used inside a layout grid. This makes it possible to wrap text around images or other objects. Child elements can either float left or right.

Also, added experimental support for CSS's shape-outside. This will wrap the text around the outline of a (transparent) image or shape, making it possible to wrap text around complex objects rather than simple rectangular boxes. Note that this will only work in modern browsers (Safari, Chrome, FireFox, not in IE or Edge!)


Tutorial (preview):
https://www.wysiwygwebbuilder.com/wrap_text.html
SEO
SEO
Search Engine Optimization settings now have a dedicated section in the page properties.
Added 'Canonical URL' property. If you have different pages with similar content (for example, a page with both a mobile and a desktop version), Google sees these as duplicate versions of the same page. Google will choose one URL as the canonical version and crawl that, and all other URLs will be considered duplicate URLs and crawled less often.
More information: https://support.google.com/webmasters/a ... 9066?hl=en
Added 'hreflang' configuration. The hreflang attribute tells Google which language you are using on a specific page, so the search engine can serve that result to users searching in that language. The links will also be added to the site map.
More information: https://support.google.com/webmasters/a ... 9077?hl=en

Search Engine Optimization settings now have a dedicated section in the page properties.
Added 'Canonical URL' property. If you have different pages with similar content (for example, a page with both a mobile and a desktop version), Google sees these as duplicate versions of the same page. Google will choose one URL as the canonical version and crawl that, and all other URLs will be considered duplicate URLs and crawled less often.
More information: https://support.google.com/webmasters/a ... 9066?hl=en
Added 'hreflang' configuration. The hreflang attribute tells Google which language you are using on a specific page, so the search engine can serve that result to users searching in that language. The links will also be added to the site map.
More information: https://support.google.com/webmasters/a ... 9077?hl=en

Web Icons
Web Icons
Web Icons settings now have a dedicated section in the page properties.
Added the ability to add 32x32 and 64x64 favorite icons to support modern browsers. These icons are in standard PNG format.
Added the ability to configure multiple Apple Touch/Android Icons to target different devices.

Web Icons settings now have a dedicated section in the page properties.
Added the ability to add 32x32 and 64x64 favorite icons to support modern browsers. These icons are in standard PNG format.
Added the ability to configure multiple Apple Touch/Android Icons to target different devices.

Theme Colors
Theme Colors
With the 'Theme color' option (inspired by the MS Office color picker) you can configure a custom color palette of 12 colors. The light and dark variants of these colors will be generated automatically, just like in Ms Office products.
It will also be possible to synchronize the colors in pages when they are modified or when you select a different color theme.



Tutorial (preview):
https://www.wysiwygwebbuilder.com/color_themes.html
With the 'Theme color' option (inspired by the MS Office color picker) you can configure a custom color palette of 12 colors. The light and dark variants of these colors will be generated automatically, just like in Ms Office products.
It will also be possible to synchronize the colors in pages when they are modified or when you select a different color theme.



Tutorial (preview):
https://www.wysiwygwebbuilder.com/color_themes.html
Rollover Text
Rollover Text
Added 'Vertical alignment' for use in combination with position -> full.

Added the ability to set background color, border and padding of the link, so you can make it look like a button.

Added 14 new animations: lines (horizontal & vertical), flip (horizontal & vertical), flip, 3d flip (horizontal & vertical), 3d carousel (horizontal & vertical), box (move, zoom, scale).

Demo:
https://www.wysiwygwebbuilder.com/suppo ... rtext.html
Added 'Vertical alignment' for use in combination with position -> full.

Added the ability to set background color, border and padding of the link, so you can make it look like a button.

Added 14 new animations: lines (horizontal & vertical), flip (horizontal & vertical), flip, 3d flip (horizontal & vertical), 3d carousel (horizontal & vertical), box (move, zoom, scale).

Demo:
https://www.wysiwygwebbuilder.com/suppo ... rtext.html
Accordion
Accordion
- Added horizontal accordion mode.
- Added 'Rotate' mode. This enables automatic cycle through panels with configurable duration.
- Added the ability to set individual colors for accordion header background.

Demo:
https://www.wysiwygwebbuilder.com/suppo ... -demo.html
- Added horizontal accordion mode.
- Added 'Rotate' mode. This enables automatic cycle through panels with configurable duration.
- Added the ability to set individual colors for accordion header background.

Demo:
https://www.wysiwygwebbuilder.com/suppo ... -demo.html
Tabs
Tabs
Added ‘Active tab’ option. This specifies the tab that will be initially displayed. Can be set to 'false' to display none at start (in combination with ‘collapsible’).

Added ‘Active tab’ option. This specifies the tab that will be initially displayed. Can be set to 'false' to display none at start (in combination with ‘collapsible’).
