All Collections
Notifications
Notification Templates
Notification Template Style Options
Notification Template Style Options

How to Use Different Style Elements to Refine the Appearance of Your Notification Templates

Angela avatar
Written by Angela
Updated over a week ago

Overview

When you create or edit a notification template on the Templates page (Administration menu > Templates), you can use many different elements to create the look and feel you want for your printed and email notifications. This image gives you a quick snapshot of all of the available style options on the Templates page.

This article describes these elements and gives examples of what each one looks like. Click on any of these links to go directly to the related section below.



Font Options

If you do not want to use the default Open Sans font style and 13 pixel size font, you can select a different font style and size for your notification template as desired. If you are copying and pasting text from another program, all of the related formatting and spacing will also be pasted here. Because this can cause issues with the look and feel of the template in emails and PDFs, we suggest doing the following:

1. Paste the copied text into Microsoft Notepad first, which will remove any existing formatting.

2. Select and copy the text in Notepad, and then paste it into the template in Syncta.


Font Styles and Sizes

To use a font style other than Open Sans, select an option from the Font Family dropdown list. To change the font size, select an option from the Font Size dropdown list. You can also choose font pixels (px) or points (pt) from the Font Size Unit dropdown list.

NOTE: One pixel equals 1 / 96th of an inch, and one point equals 1 / 72nd of an inch.


Remove Font Formatting

If you copy and paste text from another program into this template, you may notice that the font styles and formatting (line spacing, text size, etc.) used in another program are copied as well. If you don't want to remove all of the formatting at once, as described above, click the eraser icon to remove any font styles and formatting brought in from copied text.



Text Options

There are several ways you can change text in a notification template using different styles, colors, and emphasis options.


Text Styles and Colors

Click the Style icon to choose different text styles, such as Normal (typically used for the body of notifications). Click the arrow next to the Text Color icon to select from a variety of text colors.


Text Emphasis Options

If you want to emphasize certain text, use these options to make text bold, italic, or underlined. You can also use the strikethrough option to indicate text that has been deleted, or make part of your text superscript or subscript.


Text Highlighter Colors

If you want a specific portion of text to look like it is highlighted, follow the steps below.

1. Select the text you want to highlight.

2. Click the arrow next to the Background Notification icon, and then select the highlighter color you want.

The text is now highlighted in the color you selected.



Paragraph Options

There are several ways you can change the appearance of a paragraph in a notification template using lists, alignment, indentation, line spacing, and page break options.


Bulleted and Numbered Lists

To display text in a bulleted or numbered list, select the text you want to change, and then click the corresponding icon.


Paragraph Alignment and Indentation

To change the alignment or indentation of a paragraph in a notification template, select an option from the Paragraph dropdown list.


Paragraph Line Spacing

To increase or decrease the vertical space between the lines of a paragraph, click the Line Height icon to select an option from the dropdown list.


Insert Page Break

If a printed notification template is long and you want to separate it into different pages, click the Page Break icon. PDF notifications will separate pages according to where you placed the page breaks in a template.

NOTE: The page break does not appear in email notifications.



Insert Website URL Link

To include a website link in your notification template, follow the steps below.

1. Select the text in the template that you want to hyperlink to a website URL.
โ€‹

2. Click the Link icon.

3. In the popup, add the full URL of the website you want to link to.
โ€‹

4. Click Insert Link at the bottom of the popup.

The URL text appears in blue in the template. To open the URL address, simply click this text.



Insert Image

To include an image in your notification template (such as a company logo), follow the steps below.

1. Place your cursor in the template where you want the image to appear.

2. Click the Picture icon.

3. In the popup, click Choose Files.

4. Select the image you want to insert, and then click Open.

The image is inserted in the template.

5. In this example, the image is too big. To resize it, click on the image to bring up a popup, and then select the percentage that you want to reduce the image by.

Here is what the image in our example looks like after we reduced it to 25% of its original size.

NOTE: You can also manually reduce the image size by clicking on the lower right corner of the image and dragging the arrows with your cursor until you reach the size you want.


Insert Table

1. To insert a table in your notification template, click the Table icon.

2. When the popup appears, drag your cursor to select the number of columns and rows you want for your table.

The table appears in the template, as shown in this example. The color of the rows alternates between gray and white to make the table stand out more.

If you want to insert more row or columns, place your cursor in a table cell, and then select the desired option from the popup. In this example, we inserted another row and then another column.



Undo/Redo Previous Action

Similar to other word processing programs, you can undo or redo what you added or deleted in the template by clicking the arrow icons as desired. You can also undo/redo multiple actions by clicking the desired arrow icon several times until the template returns to where you want it to be.

NOTE: You can also click [Ctrl + Z] or [Ctrl + Y] on your keyboard to undo/redo an action. These keyboard shortcuts also work in most word processing programs, such as Microsoft Word.



View HTML Code

If you are familiar with HTML code and want to make refinements to your template that cannot be done using the icon options, click the Code View icon to see the code.

To return to the regular view, click the Code View icon again.

Did this answer your question?