Styling

How to style your text?

Learn how to make your text bold, change the font size, add tables and align your text.

Content

NameUseSymbol
BoldUsed to put text in bold**Text** / <strong> / <b> </b>
ItalicUsed to put text in italic*Text* / <i> </i> / <em> </em>
UnderlinedUsed to underline text_Text_ / <u> </u>
SubscriptDefines subscript text. Subscript text appears half a character below the normal line<sub> </sub>
SuperscriptDefines superscript text. Superscript text appears half a character above the normal line.<sup> </sup>
CombinationUsed to put text in bold, italic or/and underline text***_Text_***
ParagraphDefines a paragraph<p> </p>
HeadingsUsed to define a heading<h1> </h1> / <h2> </h2>
ListsUsed to make a list* Text (unordered)
1. Text(ordered)
Font sizeUsed to change the font size of text{::font size="xl"} Text {:/font} / <font>
Info textUsed to put text in an info text{::infotext} Text {:/infotext}
Warning textUsed to put text in a warning text{::warningtext} Text{:/warningtext}
HyperlinkUsed to insert a hyperlink<a> </a> /[Title](http://www.example.com)
Alignment of textUsed to align text on a page or in a table->Text<-
IndentationUsed to add indenting to markdown on a page or in a table{::indent level="6"} This text is indented {:/indent}
Line breaksInsert single line breaks in text:<br>
Thematic changeThematic break in page (e.g. a shift of topic)<hr>
StripnewlinesIt removes any newline characters (line breaks) from a string. The tag {% newline %} must be used when a break within stripnewlines is needed{% stripnewlines %}
{% newline %}
{% endstripnewlines %}

Bold

To make text bold you can use markdown by placing it between two asterisk symbols.

Alternatively you can use use the <strong> or <b> HTML tags.

**General meeting** / <strong>General meeting</strong> / <b>General meeting</b>
Output
General meeting

Italic

By placing one asterisk symbol before and after your desired text or using either the <i> or <em> HTML tag, it will appear in italic.

*General meeting* / <i>General meeting</i> /  <em>General meeting</em>
Output
General meeting

Underlined

By placing one underscore or <u> tag before and after a word or sentence, it will be underlined.

_General meeting_ /  <u>General meeting</u>
Output
General meeting

Subscript text

The <sub> tag defines subscript text. Subscript text appears half a character below the normal line.

This text contains <sub>subscript</sub> text.
Output
This text contains subscript text.

Superscript text

The <sup> tag defines superscript text. Superscript text appears half a character above the normal line.

This text contains <sup>superscript</sup> text.
Output
This text contains superscript text.

Combination

It is possible to combine two or more of the stylings above.

_***General meeting***_
Output
General meeting

Paragraph

Use a <p> tag to define a paragraph. A single line break will be added before and after each <p> tag.

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
Output

This is a paragraph.

This is another paragraph.

Headings

Use <h1> or <h2> tags to define headings in your template. <h1> is used for the main heading in your template. It is the largest heading tag and should only be used once. The <h2> tag can be used for sub headings.

<h1>This is the main heading </h1>
	<h2>This is a sub heading </h2>
Output

This is the main heading

This is a sub heading

Lists

unordered

The list items will be marked with bullets (small black circles).

* Item 1
* Item 2
* Item 3
Output
  • Item 1
  • Item 2
  • Item 3

ordered

The list items will be marked with numbers.

1. Item 1
1. Item 2
1. Item 3

1. Item 4
2. Item 5
3. Item 6
Output
  1. Item 1
  2. Item 2
  3. Item 3
  1. Item 4
  2. Item 5
  3. Item 6

Font size

The markdown font tag in combination with the size attribute makes it possible to adjust the size of your text. The size attribute has five possible values: xxs, xs, s, m, l and xl.

Alternatively you can use the HTML <font> tag with sizes 1, 2, 3, 4, 5

{::font size="xl"}General meeting{:/font} / <font size="3"> General meeting </font> / <font size="1"> General meeting </font>
Output
General meeting / General meeting / General meeting

❗️

Only use markdown font sizes in templates to avoid PDF issues.

Info text

The Silverfin templating language gives the opportunity to add info text. There are 3 ways to present it: as an inline element, as a block or as a hover element.

{% ic %}{::infotext}Inline infotext to be used inside tables{:/infotext}{% endic %}

{% ic %}{::infotext}
Standard infotext
{:/infotext}{% endic %}

{% ic %}{::infotext as="hover"}Hover infotext{:/infotext}{% endic %}

📘

What type of infotext should you use?

Inline infotexts are only used where there is limited space available, such as inside tables.
Block infotexts are the standard and should be used whenever you can.
Hover infotexts are intended to be used when the text is only relevant depending on the file, although they can also be used when there's limited space available such as in column headers.

Warning text

The Silverfin templating language gives the opportunity to add warning text. There are 3 ways to present it: as an inline element, as a block or as a hover element.

{% ic %}{::warningtext}Inline warningtext to be used inside tables{:/warningtext}{% endic %}

{% ic %}{::warningtext}
Standard warningtext
{:/warningtext}{% endic %}

{% ic %}{::warningtext as="hover"}Hover warningtext{:/warningtext}{% endic %}

📘

What type of warningtext should you use?

Inline warningtexts are only used where there is limited space available, such as inside tables.
Block warningtexts are the standard and should be used whenever you can.
Hover warningtexts are intended to be used when the text is only relevant depending on the file, although they can also be used when there's limited space available such as in column headers.

Hyperlink

To insert a hyperlink into your template use the <a> tag and href attribute or a combination of brackets [] & (). These links are also clickable in PDF export.

To go to the silverfin website homepage click <a href="https://www.silverfin.com">here</a>
Please click [here](https://www.silverfin.com) to access the Silverfin homepage
Output

To go to the silverfin website homepage click here

Please click here to access the Silverfin homepage

Alignment of text

Alignment of text function can be used to place text in a certain part of the page, for example, title of the section.

->**TEXT**<-
Output

Indentation

on a page

Indentation can be used to format information in your template by adding indenting to markdown.

{::indent level="6"}
This text is indented
{:/indent}
{::indent level="8"}
This text is indented
{:/indent}
{::indent level="10"}
This text is indented
{:/indent}
Output

Line breaks

You can use the HTML <br> tag to force a line break in your text.

To force <br> line breaks <br> in your text,<br> use the br<br> tag.
Output
To force
line breaks
in your text,
use the br
tag.

Thematic change

The <hr> tag defines a thematic break in your page (e.g. a shift of topic) and is displayed as a horizontal rule that is used to separate content.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco

<hr>

laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Output
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Stripnewlines

This tag removes any line breaks from the text. When a new line is needed the {% newline %} has to be used.

{% stripnewlines %}
  Line 1 Item 1
  Line 1 Item 2
{% newline %}
  Line 2
{% newline %}
  Line 3
{% endstripnewlines %}
Output
Line 1 Item 1 Line 1 Item 2
Line 2
Line 3