Creating an XML Template

ScreenSteps allows you to export to PDF, HTML, ScreenSteps Live and Blogs. When exporting to HTML or a Blog, ScreenSteps uses a template system to generate text files with HTML markup. You can create and customize your own templates and export XML files which can then be imported into other content management systems.

You can download the template created in this lesson here.

Open HTML Template Folder

Open the HTML Templates Preferences Pane (1) and click on the "Reveal template folder" button (2). The folder where lesson HTML templates are located will be opened in the Finder or Windows Explorer.

Copy An Existing Template

Make a copy of an existing template. I have made a copy of the "Neutral" template.

Rename Files

Rename the "Neutral copy" folder and "index.html" to something meaningful. I have chosen XML and lesson.xml. You can delete the js, css and images folders.

Open lesson.xml in Text Editor & Configure

Open the lesson.xml file in your favorite text editor and look at the configuration section (1). Change the settings of your file to match the settings in this picture.

I am using "xml-html" as the text style (2). This setting will maintain text styling (bold, italic, etc.) in the output. You can also set this to "xml" if you just want xml encoded text without styling.

I removed any image size constraints (3) so images will export at the size I have specified in my lesson.

Note that I deleted the "font family" setting as that only applies to HTML documents.

Format the Content Section

Now we can define what the exported content will look like. In this example I'm creating a basic xml document with the following hierarchy:








Here is what the rest of the template looks like.


Once you have finished configuring the lesson.xml file you are ready to export. Select the lesson you would like to export and export as HTML.

The template you created will now appear in the list of available templates. Select it (1) and click "Export" (2).

Sample Output

Your output will look something like this.


Add your comment

E-Mail me when someone replies to this comment