Configuring HTML and Blog Templates

This lesson will show you how to do some basic customization to HTML templates in ScreenSteps 2.

To learn more about HTML templates and how to customize them take a look at the "Customizing HTML Templates in ScreenSteps" manual.

Open Preferences

Select HTML Templates

Screen Overview

There are four types of templates:

  1. Lesson Templates: These apply when exporting lessons.
  2. Manual Templates (Pro only): These apply when exporting manuals.
  3. Blog Templates: These are used when posting to your own blog.
  4. Clipboard Templates: These are used when you export HTML to the system clipboard.

Select the tab for the type of template you wish to edit.

Template Configuration

Template configuration controls appear to the right of each template type.  The controls will apply to the selected template.

Font Family

Not all systems have the same fonts installed when viewing web pages.  For this reason you don't select a font, but instead a font family.  Basically, one of the fonts in the family should be installed on any system that will view your page.  

Select the font family you would like to use for your template.

Image Format

You can also adjust the image type to use as well as JPEG Quality.

Image Position

You can select whether to have the image appear above instructional text or to the right.

If you want your images to appear below the step text then you will need to manually modify the HTML template as described in our manual on customizing HTML templates.

Quick Tip: If you use large images in your lessons we suggest choosing the Above option.

Adjust Max Image Width

Here you can set the maximum images width that will be allowed when exporting to this template (in pixels). Any images that are wider than this value will be scaled down.

Quick Tip: Use this setting to makes images fit inside of your blog or wiki template for your site. We suggest setting the value at about 10 pixels less than the width of your content area.

Viewing the Templates Folder

If you would like to view/edit the actual template files right-click on a template and select Reveal Template Folder (1) or click on the Reveal Template Folder icon (2).

That's It

To see if you like your new settings, export a lesson.  If you want to make further adjustments to the HTML template you will have to actually edit the HTML template document.

2 Comments

Marcus

I am exporting lessons to Zendesk using the Zendesk template. This works very well. However, is it possible to configure the template so that it would include a PDF attachment of the lesson?

Also the export by default includes the images used in the lesson as "attachments" at the bottom of the post (with quick view text). Is it possible to stop this happening?

Trevor DeVore

@Marcus ScreenSteps does not provide a way to generate and upload a PDF file when uploading to blogs/wikis.

We don't have a way of not showing the images as attachments at the bottom of the page. The Zendesk API does not provide a way to do this.

Add your comment

E-Mail me when someone replies to this comment