Page 1 of 4

ARE YOU READY FOR IT? (teaser)

Posted: Mon Jun 10, 2019 1:29 pm
by Pablo
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!

Direct2D rendering

Posted: Mon Jun 10, 2019 2:57 pm
by Pablo
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.

Shape Dividers

Posted: Mon Jun 10, 2019 3:01 pm
by Pablo
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

Unsplash Integration

Posted: Mon Jun 10, 2019 3:07 pm
by Pablo
Unsplash Integration
Browse thousands of free-to-use, high quality images from Unsplash directly within WYSIWYG Web Builder.

Image

Preloader

Posted: Mon Jun 10, 2019 3:10 pm
by Pablo
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.

Image

Image

Image

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

Posted: Mon Jun 10, 2019 9:06 pm
by Pablo
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.

Image

Image

Tutorial (preview):
https://www.wysiwygwebbuilder.com/svg_animations.html

Toasts

Posted: Tue Jun 11, 2019 11:18 am
by Pablo
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.

Image

Tutorial (preview):
https://www.wysiwygwebbuilder.com/toasts.html

FlipSwitch

Posted: Tue Jun 11, 2019 11:21 am
by Pablo
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.

Image

Demo:
https://www.wysiwygwebbuilder.com/suppo ... witch.html

Wrap Text

Posted: Tue Jun 11, 2019 11:24 am
by Pablo
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.

Image

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!)

Image

Image

Tutorial (preview):
https://www.wysiwygwebbuilder.com/wrap_text.html

SEO

Posted: Tue Jun 11, 2019 3:07 pm
by Pablo
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

Image

Web Icons

Posted: Tue Jun 11, 2019 3:12 pm
by Pablo
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.

Image

Theme Colors

Posted: Tue Jun 11, 2019 3:14 pm
by Pablo
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.

Image

Image

Image

Tutorial (preview):
https://www.wysiwygwebbuilder.com/color_themes.html

Rollover Text

Posted: Tue Jun 11, 2019 5:53 pm
by Pablo
Rollover Text
Added 'Vertical alignment' for use in combination with position -> full.

Image

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

Image

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

Image


Demo:
https://www.wysiwygwebbuilder.com/suppo ... rtext.html

Accordion

Posted: Tue Jun 11, 2019 6:04 pm
by Pablo
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.

Image


Demo:
https://www.wysiwygwebbuilder.com/suppo ... -demo.html

Tabs

Posted: Tue Jun 11, 2019 6:07 pm
by Pablo
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’).

Image