Template Designer

The Template Designer is user friendly and WYSIWYG (What You See Is What You Get) interface to design your document templates.

It’s important to note that with the Design View you can design almost any template, but for more advanced cases you may need to use the HTML and CSS Editor. The three different modes are explained in this documentation.

The Top Bar

The top bar has two main functions:

• Show the current template information: Name, Status and Version Number. The name is set when you save the template, and the status and version number are automatically set depending on the actions your performed on the template.
• Show the Template Designer action buttons:
  • Mode Picker: Design, HTML and CSS. You can set the view mode for the designer.
  • Preview: It shows a preview of the current template for a given sample record.
  • New: Creates a new Template.
  • Open: Opens an existing template.
  • Activate / Deactivate: Activates or deactivates the current version.
  • Save: Saves the changes
  • Save as: Save a copy of the template (a version 0)
  • Clear Cache: Clear the cached version of the template.

Left Bar

The left bar is made up from three different components.

Elements Palette

From this Palette you can drag and drop any element into the canvas.

Fields Navigator

It’s in this component where you need to choose the template base object. Once selected you will be able to navigate through all the different fields and relationships in the object to insert them into the template. If you click a field or relationship it will automatically copy the API name into the clipboard.

Navigator

The navigator shows the template schema with all the component hierarchy. From here you can select any desired element.

Inspector

When you select any element in the canvas, the inspector will show the different options you have to customise it.

On the top it will show the Element Type and also the immediate element parent/ancestor that you can click to navigate to it.

The elements will usually show two tabs on the inspector:

• Attributes: which are specific attributes for that element type.
• Styling: which are common HTML/CSS styling Attributes that can be applied to any element.

The Canvas

The canvas it’s the most important part of the Template designer, as it is where you can drad and drop the different elements and visualize your customizations.