Add a new template
To create an HTML template that can be edited and previewed directly in XTRF, perform the following steps:
Go to the
Configuration menu → Templates → Document Templates → Templates tab.
Click the Add HTML-based Template button. You will be directed to the Templates page.
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.
Provide the Template Name.
Select the Template Type from the drop-down list.
Click the Add Template button. You will be directed to the newly created template's page.
In the Template details card, decide whether the new template should be:
Active and thus selectable
a Default one.
In the Template designer card:
Select the language versions for this template:
Click the
to open the language menu and add the desired languages. To close the language menu, click the icon again.Click the
icon next to the language to open a menu of applicable actions.
(Optional) Edit the standard template in the Editor section:
Select a different Theme from the drop-down list. To learn how to add a custom theme, see the section below.
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).
iii. (Optional) Switch to the HTML editor to edit the HTML code directly.
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.
(Optional) Preview the document.
On top of the right-hand pane, select the desired Theme from the drop-down list.
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.
Click the Save button in the top right-hand corner.
Click the icon to check the details of the template. Click the icon to expand the Template designer card.
Each language version can be enabled or disabled, but at least one will always remain enabled. One of the enabled languages can also be set as a default one for a given template. Each template always has a default language version.
When generating or sending documents for your clients and vendors, the system will automatically use the language version that matches the recipient's preferred language for the e-mails. If the required language version of the document is not enabled, the default localization wil’tt be displayed correctly. Please bear in minPortal’sertain languages have different locale codes, client’sple, EN-GB and EN-US. The system defines them as diffetemplate’sages, so make sure those settings are aligned as needed.
Add a custom theme
To create a custom theme for HTML document templates, perform the following steps:
Go to the
Configuration menu → Templates → Document Templates → Themes tab.
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.
Give the new theme a name.
Click the Add Theme button. You will be directed to the newly created theme's page.
In the Theme details card, decide whether the new template should be
Active and thus selectable
a Default one.
In the Theme designer card:
Select the language versions for this theme:
Click the
icon to open the language menu and add the desired languages. To close the language menu, click the icon again.
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.
Create the theme in the Editor section:
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).
(Optional) In the Styles tab, you can edit the CSS settings for this theme.
(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.
Select a font from the Custom Font drop-down list and decide whether you want to set it for the whole page.
Click on a background image and select whether it should be resized or repeated.
Check the results in the Preview section. Click the
icon to display the theme or applied changes.
💡 This section is equipped with several options like pagination, scaling, page-turning, rotating, etc., available in the menu.
Click the Save button in the top right-hand corner.
Click the icon to check the details of the theme. Click the icon to expand the Theme designer card.
Add a custom font
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.
You can also drop the font file into the framed area.
Add a custom background
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.
You can also drop the image file into the framed area.
