Ephox LiveWorks!

Web Content Management for Government Sites with Ephox and IBM

Implementing and managing a web content management system is a difficult task – particularly in a government organization where content has to comply with strict regulations. Using real customer examples, we will discuss how government sites are successfully using IBM Lotus Web Content Management and EditLive! to save time, comply with complicated policies, and provide the widest accessibility.

In addition, the Ephox team will demonstrate a sneak preview of the upcoming EditLive! release – V7 which packs significant new functionality.

Agenda

Introduction (5 min)
IBM Government Industry Toolbox for Websphere Portal (10 min)
How government sites are using EditLive! and IBM Lotus Web Content Management (15 min)
EditLive! interactive demo highlighting helpful features for government including a sneak peak of EditLive 7.0. (20 min)
Q&A (10 min)

About the Speakers

Michael Fromin is currently the director of products at Ephox Corporation. With over 21 years experience in IT, including 10 years in consulting, Michael has worked extensively with Fortune 100 companies and has vast experience in development, infrastructure and help desk management. Mr. Fromin has authored numerous technical articles focused on advanced development techniques for Lotus Domino, Java, and WebSphere Portal.
Krishnan Hariharan has more than 12 years of experience in the field of portals and content management. Krishnan currently works at IBM as the Product/Offering Manager for Lotus Web Content Management and WebSphere Portal Content Accelerator. His main responsibilities include in assessing market trends and leading the strategic direction, positioning and go-to-market strategies for Lotus Web Content Management.

Webinar Recording

Pasting Into EditLive! - How does filtered HTML make it to the editor from MS Word?

Thu, 15 Jul 2010 22:23:55 +0100

When we copy-paste from a program like Microsoft Word into EditLive, information is placed first on the clipboard and then is inserted into EditLive. Often, we end up with a great deal more on the clipboard than you might expect. A simple line of text might bring with it hundreds of lines worth of style sheet declarations, metadata, and application-specific data, and we don't want this unnecessary markup making it into our HTML! Thankfully EditLive! offers a clean copy-paste from Microsoft Word right out of the box, ensuring that the code that arrives in the editor is clean and standards compliant.

Lets explore how this copy-paste operation works, when are filters applied, and how information makes it from the a Word Document to EditLive.

How does clean copy-paste happen?
The process takes 4 discrete stages, and each is clearly visible within an EditLive debug log. It is suggested that you create a debug log of your own (capturing the steps of a copy-paste action) and then follow along with this guide.

The diagram below represents the 4 stages of the process: pasting, filtering, tidying, and insertion.

First, the user copies inform Microsoft Word and then performs a paste action into EditLive. Looking at the debug log, we see that EditLive has received the data, and a simple copy-paste of one line of text has ballooned to be over 100 lines of code!

The log displays the unfiltered HTML after the following declaration as EditLive interprets the pasted content.

13:48:40:842 [DEBUG] EphoxTransferHandler - -(AWT-EventQueue-3) Import data.13:48:40:843 [DEBUG] EphoxTransferHandler - -(AWT-EventQueue-3) Available data flavors: [...] [MS Word HTML Redacted - It really is that long!]

The unfiltered content appears a second time as it is actually pulled from the clipboard. No filtering has occurred at this point.

13:48:40:890 [DEBUG] EphoxTransferHandler - -(AWT-EventQueue-3) Clipboard data:<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns:css="http://macVmlSchemaUri" xmlns="http://www.w3.org/TR/REC-html40"> [...] ###Content### [...] </html>

EditLive then reads the content and filters out Word-Specific markup. Some styling may be preserved, depending the setup of your configuration file. The resultant HTML (as seen below) is almost right, but still includes un-necessary items. Once completed, any of your own paste filters will be applied at this stage.

13:48:40:893 [DEBUG] EphoxPasteFilter - -(AWT-EventQueue-3) Clean word13:48:40:971 [DEBUG] OfficeImportFunction - -(AWT-EventQueue-3) Content before importing MS-Word lists: <html> [...] ###Content### [...] </html>

Finally, EditLive reformats the word-markup-free HTML and removes any containing HTML items that won't be needed. The insert operation is then performed and content appears in the editor window.

13:48:40:986 [DEBUG] InsertHtmlOperation - -(AWT-EventQueue-3) Filtered content: ###Content###

We’ve seen that copy pasting from Microsoft Word is a multi-step process, where information moves first to the clipboard, and then into EditLive where it is filtered before actually arriving in your content. Remember that these precautions are taken to avoid unnecessary markup, ensure standards-compliant HTML, and to give you the chance to modify HTML before it arrives in the editor.

But what about other application data that we might want, like track changes?
Unfortunately, EditLive is only able to draw from what an application places onto the clipboard. Things like track changes, page sizes, versioning and owner information just don't make it to the clipboard, and as such are not imported to EditLive.

What if items are making it into the editor that we do not want?
If need to restrict items (tags, images, etc.) from making it from the clipboard into the editor, we encourage you to create your own paste filter to strip out those elements before they can harm your content.

Further Reading
Configure Word Paste Options
Filter Pasted Content

EPiServer Intro

Tue, 1 Jun 2010 13:27:29 +0100

Overview of EditLive! Running in EPiServer CMS Release 5

EditLive! is now able to be used as the rich text editor inside EPiServer CMS release 5 and there are plans to provide this functionality in EPiServer CMS release 6 very soon.

This document is intended to provide an overview of how you can set EditLive! to appear as the default rich text editor inside EPiServer.

By following the examples below the EPiServer administrator can set up their V5 release to use EditLive! in place of the currently shipped editor on a predefined template page.

Once logged into EPiServer the administration mode will need to be selected. Navigating to the Config tab in the administrator pages, select the plug in manager. Ensure that EditLive.EPiServer5 is visible to you as an available plug-in (see diagram below).

Once you have the plug in added you can set up EditLive! as a custom property type. Go to the Page Type tab and the Manage Page Types section whilst you are in the administrator role to set this up – see diagram below. (Click the create button to set this up for the first time or click on the link for Ephox.EditLive! to edit an existing property.

You will need to set up the data type information for this as follows:

You can now select the EditLive! plug-in and customize it’s settings. This will allow you to define which features of the EditLive! are available to your end users.

Options available to you include setting a default value, allowing inherited values and controlling which of the menu and toolbar settings are visible. Many of these can be simply turned on and off by selecting the relevant check box from the list available (see diagram below for an example of this).

What we now need to do is decide where in EPiServer we will use EditLive! now that is available to us. For this example we are going set the MainBody property to use EditLive!

Once you have set up EpiServer to allow the use of EditLive you can now create a template page. Enter edit mode and select the Page Types tab. Here you can choose to create a new template or edit an existing one. For this example we have created a sample page template called EditLive! Standard Page. To add a property to your page select the Add Property button and select MainBody. The MainBody has been set up to use the Type of EditLive! (Previous page) This means that now whenever you add a MainBody property to a page EditLive! will open up by default when the user performs an edit.

You are now set up to use EditLive within the EPiServer CMS.

Upgrade to EditLive! 7.0.2 changes local settings file location

Tue, 16 Feb 2010 01:42:39 +0000

The EditLive! 7.0.2.42 release changed the location the local settings file for EditLive! is stored. This was in response to problems encountered with roaming profiles in Windows.

How can this affect your local dictionary or username?

Consider the following scenario.

Your production system is running a version of EditLive! prior to 7.0.2. You decide to check out the latest version features, either through the demo at Ephox, or on a development server. When you are next working in your production environment you then add some words to your dictionary.

When the production server is upgraded to 7.0.2 (or greater) you notice your words appear mis-spelt, despite adding them in the past to the dictionary.

So what happened?

The first time EditLive! 7.0.2 is run, it will migrate the contents of the old local settings file to the new location. From then on, it will refer to this new file location.

When you added the words, it was to the old local settings file. As the file contents had been previously migrated when you tested the new version of EditLive, when you upgraded to EditLive! 7.0.2, the new words weren't there.

This also occurs if between the initial load of EditLive! 7.0.2 and subsequent upgrade of the production server the username for Track Changes/Commenting is altered.

Once the upgrade has occurred, changing the username or adding words to the dictionary will continue to function as normal.

Micro-Templating in EditLive!

Mon, 7 Dec 2009 13:44:27 +0000

The new micro-templating feature in EditLive! 7.0 allows non-technical authors to use pre-defined templates to create better looking and more consistent web pages without having to recreate layouts from scratch all the time. This video shows how content authors can use micro-templating and how administrators can configure the available templates.