EditLive! 9 contains a broad range of new functionality including media functionality, HTML5 support, new user interface options and more. This document describes the major changes in EditLive! 9 and how to upgrade your existing EditLive! deployment to take advantage of them.
Table of Contents
All EditLive! users will be required to upgrade their license to use EditLive! 9.0. An example 9.0 license key looks like the following:
To get your EditLive! 9.0 license, please log a support case in the Ephox support system.
New Editor Features Including Toolbar Buttons and Menu Items
Social and Embedded Media
EditLive! 9 includes upgraded media support, with enhanced embedding functionality and support for social media services like YouTube, Vimeo, Flickr, Google Maps, SlideShare and other web-based media aggregator services like embed.ly. This functionality makes embedding social and cloud-based media as simple as creating a hyperlink. Users need only copy the URL of the resource (usually the browser's URL) into EditLive!'s media dialog and then the oEmbed standard is used to obtain the media at that URL and embed it into the content in EditLive!.
For more information on Social and Embedded Media support, including configuration information, refer to the Developer Guide Using Social Media and External Media Services.
HTML5 Media - AUDIO and VIDEO Tags
EditLive! 9 introduces support for insertion of HTML5 <video> and <audio> tags. This is achieved through the Video and Audio tabs on the Insert Media dialog with placeholder images displayed within EditLive!. This functionality works with content that's already available on web servers.
HTML5 media cannot be played back in EditLive!'s Design view. In this view the media will be inserted with an appropriate place holder.
Media can be played back in the Preview tab.
Page Width and Mobile Preview
EditLive! 9 introduces the ability to render your content for a specific page width with the new Page Width function. The functionality is particularly useful when content being created by users may be read on mobile devices in addition to desktop machines. It is preconfigured with common page widths corresponding to mobile and desktop devices.
For more information on including the Page Width on your toolbar refer to the View Commands section of the Menu and Toolbar Item List.
HTML5 Semantic Elements
EditLive! 9 supports the broadest range of HTML5 markup of any rich text editor. In addition to the HTML5 media tags listed previously it also supports the full range of HTML5 semantic tags and ensures the validity of any content created containing these tags. This markup provides extra semantic meaning within pages and can be particularly significant for accessibility or providing extra styling flexibility.
HTML 5 semantic block elements can be inserted using the Create Section toolbar button and removed using the Remove Section toolbar button.
Enhanced HTML Support
EditLive! 9 has enhanced support for the following HTML tags:
- Blockquote - This tag can now be inserted as a standalone tag or wrapped around existing content using the Blockquote option on the Create Section menu.
- DIV - The rendering for DIVs has been improved and they have been added as an option on the Create Section menu.
- iframe - EditLive! 9 provides an improved rendering for this tag using a placeholder icon and the height and width of the iframe.
New Toolbar Megamenus
EditLive! 9 introduces megamenus that can be added to the toolbar and menus. When used on the toolbar megamenus are represented by a single toolbar icon with a chevron next to it to indicate more options are available. When used on a menu these megamenus appear as submenus.
For more information on the configuration settings for these refer to the appropriate sections in Menu and Toolbar Item List
New User Interface Options
For an example of using these new features refer to the quick start guide Creating a Minimal Editing UI with In-place Editing.
New Style Options
EditLive! 9 introduces the ability to both Blacklist or Whitelist the styles in the style sheet supplied to EditLive!. Whitelisting is where only those styles explicitly marked for inclusion in the stylesheet will appear in the Styles drop down. Blacklisting is where all styles, except those that are explicitly excluded will appear in the Styles drop down.
For more detailed explanation refer to the Developer Guide Restricting what CSS classes appear in EditLive! styles drop down.
EditLive! now requires Java 1.6 as the minimum version of Java.
For more information see the System Requirements section of this documentation.
EditLive! 9 features an updated loading screen that improves the user experience with more subtle load time visuals. The traditional loading dialogue with a progress meter has been replaced with a dimmed view of the Preview pane and spinner while EditLive! loads in the background. Once EditLive! has loaded the user immediately sees the editor interface.
To enhance the user experience of EditLive!'s inline editing mode users no longer have to click on the Design tab to load the editing interface for an inline instance of EditLive!. In EditLive! 9 clicking within the Preview pane of an in-line instance of EditLive! will load the editing interface of EditLive!. The exception to this is if the user clicks on an interactive component within the preview - e.g. a Google Map, YouTube video etc - that interaction will not trigger a change from Preview to Design mode.
Updated EditLive! UI
EditLive! 9 includes an updated user interface. While Ephox has worked to ensure the changes to existing UIs is minimal this update does affect some of the widths and heights of items in EditLive! and you are advised to test this with your configuration prior to updating your production environment. Changes in buttons widths in particular may cause your toolbar to wrap unexpectedly. The following lists some of the key changes:
- The introduction of chevrons to represent megamenus on the list, table and colour buttons increase the space these buttons require on the toolbar.
- The widths of the style, font and font size drop downs have been reduced. Long style or font names may now be truncated.
- The height of toolbars have been reduced.
- The spacing between toolbar button groups has been reduced.
- EditLive! now uses the Open Sans font by default. Changes to the font may affect the appearance of custom dialogs developed using the Advanced Java API.
List Toolbar Buttons Converted to Megamenus
The Ordered and Unordered List toolbar buttons have been converted to megamenus - a convention used by most word processors today. These megamenus provide access to the different HTML list types available for each list. Previously changing the list type required the user to open the List Properties dialog.
User-friendly Style Names
Class name that use naming conventions with camelCase, underscores or hyphens will be converted into user-friendly names. For more information refer to the User Friendly Style Names section of Using CSS in EditLive!
The W3C accessibility guidelines have been updated from WCAG 1.0 to WCAG 2.0. As per the standard, WCAG 1.0 "1" and "2" ratings have been replaced by the WCAG 2.0 "A" and "AA" ratings.
The accessibility as-you-type check for absolute vs relative widths on DIVs and tables has been removed as it is no longer valid for WCAG 2.0.
HTML5 and interactive embeddable media elements are now able to be previewed in the EditLive! Preview pane. They can also be interacted with in the Preview pane.
Create and Remove Section Commands
Create Section (DIV) and Remove Section (DIV) have been enhanced to now provide the ability to insert and remove HTML 5 Semantic tags along with DIV and Blockquote elements. The configuration setting to add to the Toolbar and Menu remains the same as previous version.
Oracle (aka "Sun") HTTP Client Used by Default
EditLive! 9 uses the Oracle (previously known as the "Sun") HTTP client layer to make requests by default. Most users will not notice any changes associated with this.
raiseEvent API Passes the Applet ID
Functionality Removed in 9.1
WebDav functionality is deprecated has been removed, as of EditLive! 9.1. The following related configuration items are also deprecatedno longer have any effect:
Any calls to this function will need to be removed:
Java APIs Removed in 9.1
See: Java API