Customer's Canvas supports such text types as point (a string without a fixed width), bounded, plain, and rich formatted text. This topic dwells on these text types and their features.
Point text represents a text block of variable width. Point text does not support automatic text wrapping. If a user changes the text in this element, then it causes the text block width to change. Customer's Canvas loads point text layers from PSD templates in plain format.
The following screenshot shows point text in the editor.
To create a plain text element in Customer's Canvas, click Add text on the Text menu, on the Toolbox.
Note, this is the default configuration of the Toolbox. To configure a custom toolbox, refer to the Customizing the User Interface topic.
Text placeholders allow you to specify a prompt that motivates users to fill in a text box. In Customer's Canvas they look as follows:
In this example, you can see that the Type a name prompt does not act as a regular text string, and the user does not have to remove it before entering their own text.
You can enable a placeholder by using the <TPH> marker in either a Photoshop or InDesign template.
In the case where a user leaves the placeholder unfilled, the prompt does not appear in the hi-res output. However, you may want to indicate on proof images that the placeholder should contain a text. To enable this, set the rendering.proofImageShowStubContent property to true in clientConfig.json.
You can specify the maximum number of lines and characters per line that the user is allowed to enter into a point text or plain bounded text. The <TMLC> marker defines the maximum line count in a text element. <TMLL> allows you to set up the maximum number of characters per line. For example, if you add the <TMLL_10><TMLC_2> markers to a layer name, you can observe the following counter in the lower-right corner of the pop-up box.
If you do not specify these markers, the user is allowed to enter as many characters and lines as they want.
When you use OpenType features in your PSD and IDML templates, Customer's Canvas applies them to point and plain bounded text. The following OpenType features are rendered by default if your font supports them:
For the full list of supported OpenType features, you can refer to the specification of the Aurigma Graphics Mill library.
In contrast to point text, bounded text takes a rectangular area and has a fixed width and height. Users can change the size of the bounding rectangle and rich formatting in the editor. If such a text does not fit the bounding rectangle by height, it is cropped. This text type has additional features: rich formatting, autofit, text wrapping, and more. Let us discuss them in detail.
Customer's Canvas loads paragraph text layers from Photoshop and text frames from InDesign as rich formatted bounded text by default.
This text type uses a special editor allowing your users to specify an individual style for every character. You can configure this Rich text editor. For example, you can disable irrelevant controls, enable the WYSIWYG mode, and more. Rich formatted bounded text may have columns and wrap around other elements or inside shapes.
The following screenshot shows rich formatted text in Customer's Canvas.
To create a rich formatted text element in the editor, click the Rich text command on the Text menu.
This text type has bounds but uses the same editor as point text.
In PSD and IDML templates, you can activate this mode by using <RT_false>. The <RT> marker allows you to activate the following modes for bounded text:
White paper: Templates in web-to-print. Free download <RT_true> keeps rich text formatting.<RT_false> enables plain formatting (if there are various styles in a text element, then the first style is applied to the entire text and the rest styles are ignored).<RT_auto> keeps rich text format only if this layer contains various styling.Also, Customer's Canvas activates this mode when you enable copyfitting.
To allow your users to create bounded text in the editor, you need to enable the Bounded text command in the Toolbox. You can do this by adding the BoundedText action to the Toolbox.buttons array in clientConfig.json.
When your users add rich formatted text to the canvas, the one-column text appears by default. To allow them to create multicolumn text with rich formatting, set the createMultiColumnText property to true. You can define this configuration parameter in clientConfig.json or through IConfiguration.
Customer's Canvas supports multicolumn text imported from InDesign templates. In Photoshop templates, you can enable columns by using the <TCC> marker.
From the Top Toolbar, you can vertically align both rich formatted and plain bounded text types within their bounds.
To specify vertical alignment in PSD or IDML templates, add the <TVA_xxx> marker to a text element. There are top, center, and bottom values available for this marker. For example, <TVA_top> automatically aligns text with the top bound of the layer.
<TVA_xxx> is ignored if the layer contains the <TCC> marker defining a column count or the <PBT> marker getting the text wrapped inside a shape. If any of these markers are used in a paragraph layer name, the text string is aligned with the upper bound and the alignment cannot be changed. The default value is top; it is used if a layer name does not contain <TVA>.
For rich formatted text, unlike point and plain bounded text, you cannot limit the number of lines. Instead, Customer's Canvas allows for limiting a maximum number of characters that users can enter in the Rich Text Editor.
The <TCL_n> marker enables this feature for rich formatted text in PSD and IDML templates, where n is a maximum possible number of characters allowed in the corresponding element. For example, <TCL_200> allows users to enter up to 200 characters. It will not accept any new characters if the user reaches the limit.
The character count turns red if a user reaches the limit.
For plain bounded text, you can enable copyfitting. The <TOS> marker defines how to change the text if it goes out of its bounds. For example, Customer's Canvas can crop it or fit it into the bounding rectangle. You can specify how to shrink such text - by either scaling the text or changing the font size - by using the <TSM> marker.