To create an HTML template that can be edited and previewed directly in XTRF, perform the following steps:

1. Go to the Configuration menu → Templates → Document Templates → Templates tab.

   Open

   

2. Click the Add HTML-based Template button. You will be directed to the Templates page.

   Open

   

   To create a new template based on the existing one, open it in edit mode and click the Copy button in the top right-hand corner.

3. Provide the Template Name.

4. Select the Template Type from the drop-down list.

5. Click the Add Template button. You will be directed to the newly created template's page.

6. In the Template details card, decide whether the new template should be:

   1. Active and thus selectable

   2. a Default one.

7. In the Template designer card:

   1. Select the language versions for this template:

      1. Click the to open the language menu and add the desired languages. To close the language menu, click the icon again.

      2. Click the icon next to the language to open a menu of applicable actions.

   2. (Optional) Edit the standard template in the Editor section:

      1. Select a different Theme from the drop-down list. To learn how to add a custom theme, see the section below.

      2. Change the formatting using the editor tools.
         Please keep in mind that pasting the copied text in the 'Simple' editor will also paste the text styling, which may cause problems for some values (e.g. when checking if the text is equal to other text or when entering Custom Fields "Key" names).

      3. (Optional) Switch to the HTML editor to edit the HTML code directly.

      4. Add or change the template's XTRF tags. Put the cursor in the desired place of the template and click the icon to open the list of applicable tags. Locate the desired tag and click on it to add it to the template.

   3. (Optional) Preview the document.

      1. On top of the right-hand pane, select the desired Theme from the drop-down list.

      2. Select a corresponding item in the search-as-you-type field. The preview will appear below.
         The item depends on the selected Template Type, e.g., for a Client Project Confirmation, you can select a project; for Vendor Purchase Order - a job, etc.

   4. Click the Save button in the top right-hand corner.

To create a custom theme for HTML document templates, perform the following steps:

1. Go to the Configuration menu → Templates → Document Templates → Themes tab.

2. Click the Add New Theme button. You will be directed to the Themes page.

   To create a new theme based on the existing one, open it in edit mode and click the Copy button in the top right-hand corner.

3. Give the new theme a name.

4. Click the Add Theme button. You will be directed to the newly created theme's page.

5. In the Theme details card, decide whether the new template should be

   1. Active and thus selectable

   2. a Default one.

6. In the Theme designer card:

   1. Select the language versions for this theme:

      1. Click the icon to open the language menu and add the desired languages. To close the language menu, click the icon again.

   2. Click the on next to the language to open a menu of applicable actions.
      If you want to use one theme for all language versions of a certain template, add only one default language. You can add other languages on the template level. 

7. Create the theme in the Editor section:

   1. In the Theme tab, create the desired elements. To add XTRF tags, click the icon. To edit the HTML code directly, switch to the HTML editor.

      Please keep in mind that pasting the copied text in the ‘Simple’ editor will also paste the text styling, which may cause problems for some values (e.g. when checking if the text is equal to other text or when entering Custom Fields "Key" names).

   2. (Optional) In the Styles tab, you can edit the CSS settings for this theme.

      1. (Optional) In the Options tab, you can select custom fonts and background images for this theme. To learn how to add custom fonts and backgrounds, see the following sections of this guide.

      2. Select a font from the Custom Font drop-down list and decide whether you want to set it for the whole page.

      3. Click on a background image and select whether it should be resized or repeated.

8. Check the results in the Preview section. Click the icon to display the theme or applied changes.
   This section has several options, such as pagination, scaling, page-turning, rotating, etc., available in the menu.

9. Click the Save button in the top right-hand corner.

To add a custom font to use in document templates' themes, go to the Configuration menu → Templates → Document Templates → Fonts tab and click the Select File button.

To add an image that will be used as background in document templates' themes, go to the Configuration menu → Templates → Document Templates → Background tab and click the Select File button.