Certain textboxes on your Shift72 platform support markdown. These are Film records Synopsis field, a Pages Content field, a Collections Description, and Bundle Descriptions.

Some Markdown is unsupported due to how it interacts with the template.

HTML tags are not supported in apps, if you will be using an app please do not use HTML tags on your platform.

Markdown does not recognise multiple consecutive spaces. To create a horizontal offset, a blank character can be used. To add a blank character, hold ‘Alt,’ then on the Numpad of your keyboard type 255, then release ‘Alt.’ A blank character will appear. This can be used as many times in a row as necessary to get a horizontal offset.

Note: this will only work in windows operating systems.

Back to Top

Markdown does not recognise multiple consecutive newline characters. These are what is typed when you press ‘Enter’ while typing. To add more of these, use the HTML tag <br/>.

Back to Top

To add a heading, type a ‘Hash’ (#) symbol. The number of hash (#) symbols before text indicates the type of heading that is being added. Headings increase the size of the text. e.g.

# Heading 1

## Heading 2

### Heading 3

Etc…

Heading 1 will be the largest text. Every subsequent heading will have smaller text than the last.

Back to Top

A list can be created in Markdown, which will show up on the front end of your Shift72 platform.

This can be done with either a ‘Hyphen’ (-) before each entry to have an unordered list or with Numbers before each entry to create an ordered list.

Markdown will also automatically order a numbered list, regardless of what the numbers are. For example, typing the text below:

1. First Item

1. Second Item

1. Third Item

Will display as this on the front end:

If you would like to avoid a number, followed by a full stop from becoming an ordered list, you will need to escape the full stop with a backslash:

1\.

This will display as 1. on the front end without becoming an ordered list.

Back to Top

Right to left text can be formatted by adding <bdo dir="rtl"> … </bdo> around the text you want to display in right to left orientation. The text below:

<bdo dir="rtl"> Right to left text </bdo>

Will display like this on the front end:

Back to Top

Some characters are used for Markdown formatting. Sometimes you will want to display these normally. To do this, simply add a backslash (\) before them, and they will show up normally.

Below is a list of characters that will need a backslash to display normally.

\ Backslash

` Backtick

* Asterisk

_ Underscore

{ } Curly Brace

[ ] Square Brackets

( ) Parenthesis

# Hash

+ Plus sign

- Hyphen

! Exclamation mark

. Full Stop

Back to Top

Abbreviations can be used by adding <abbr> tags around the text. The title will be added within these tags. So the text below:

<abbr title="Shift72 Film Festival">S72FF</abbr>

Will display like this on the front end:

Which you can then mouse over to display the full name:

Back to Top

Superscripts can be used by adding ^… tags around text. The text below:

Superscript^TM

Will display like this on the front end.

Back to Top

Similar to superscripts, subscripts can be used by adding _… tags around text. The text below:

Subscript_TM

Will display like this on the front end.

Back to Top

Text size can be reduced by adding <small> … </small> tags around the text.

<small>Small</small> Text

Will display like this on the front end:

Back to Top

Text can be highlighted by adding <mark> … </mark> tags around the text.

<mark>Highlight</mark>

Will display like this on the front end:

Back to Top

Text can be underlined by adding <ins> … </ins> tags around the text.

<ins>Underline</ins>

Will display like this on the front end:

Back to Top

You can add a strikethrough to text by adding <del> … </del> tags around the text.

<del> Strikethrough </del>

Will display like this on the front end:

Back to Top

Tags can be combined to give the same text the effect of multiple tags.

The text:

<small><b> Small and bold </b></small>

And

<ins><del> Strikethrough and underline</del></ins>

Will display like this on the front end:

This will also apply to any number of tags used around a single piece of text, so the text below:

<small><b><ins><del> Strikethrough and underline and small and bold </del></ins></b></small>

Will display like this on the front end:

This is a combination of strikethrough, underlined, small and bold text.

Back to Top

Tables can be added to the text in your Shift72 platform. The tables do not have outlines, but the text is formatted as a table. An example of this can be seen below:

The code below is used to create the above table.

<table border="1" cellpadding="4" cellspacing="1">

<thead><tr><th>Column 1</th><th>Column 2</th></tr></thead>

<tbody>

<tr valign="top"><td>First Entry</td><td>Second Column</td></tr>

<tr valign="top"><td>Second Entry</td><td>Second Column 2</td></tr>

</tbody>

<tfoot><tr valign="top"><td>Third Entry</td><td>Second Column 3</td></tr>

</tfoot>

</table>

Each line means as follows:

<table border="1" cellpadding="4" cellspacing="1">

<thead><tr><th>Column 1</th><th>Column 2</th></tr></thead>

<tbody>

<tr valign="top"><td>First Entry</td><td>Second Column</td></tr>

<tr valign="top"><td>Second Entry</td><td>Second Column 2</td></tr>

</tbody>

<tfoot><tr valign="top"><td>Third Entry</td><td>Second Column 3</td></tr>

</tfoot>

</table>

Back to Top

You can create a clickable image that will redirect users using the code below:

<a href=LINK_HERE rel=”DESCRIPTION_HERE”></a>

This functions the same as a regular link but uses an image instead of text. Below is an explanation of how to use this code to create an image link.

Replace LINK_HERE with the URL the image will link to.

Replace DESCRIPTION_HERE with a description of the link.

Replace IMAGE_LINK_HERE with the URL of the image users will click to be redirected.

The code below is a working example of this, paste it into a supported text box to try it out to see how this works.

<a href= https://www.shift72.com/ rel="Shift 72"></a>

Back to Top

Markdown allows you to create a clickable button that will reveal text when clicked. This can be useful to avoid cluttering up a page.

Use the code below:

A dropdown menu can be added by formatting as follows:

<details>

<summary>Click Here</summary>

So it is revealed

</details>

To create this text:

Once clicked, it will open to reveal the <summary> text.

This can also be used with images, so a large image can be added without cluttering up a page.

Back to Top

A horizontal rule is a separator line that can be used to split up blocks of text. This can be added either using </hr> or 3 underscore (___).

This can be written like as such:

Separator below Separator below

___ or </hr>

Separator above Separator above

These will be displayed as below on the front end:

Back to Top

A code block can be added to your platform by adding backticks on either side of the text.

This text:

test `test`

Will display like this on the front end:

This can also be done using <code> ... </code> tags.

Back to Top

&nbsp:

Non-breaking space will just display as &nbsp on the front end.

<p style=”text-align:ALIGNMENT”> </p> - Text alignment:

This will not work on your front end as this is overwritten by the text alignment in the front end template.

<svg> - svg images:

SVG Images are unsupported on the front end of your platform.

Text colours:

Text cannot be recoloured in markdown supported fields. This is because the colour is overwritten by the template once the text is displayed on the front end.

<blockquote> ... </blockquote> - blockquotes:

Blockquotes do not show up on the front end.

<kbd> … </kbd> - Keyboard Input:

This does not have any effect on the front end.

<p style="font-size:24px;"> ... </p> Font size:

This does not have any effect on the front end.

Back to Top