English
Register →

Text formatting

Description Syntax Result
Escape a character so it isn't processed \*not processed\* *not processed*
Bold **This text is bold** This text is bold
Italic *This text is italic* This text is italic
Font family :[Handwritten text]{font=cursive} Handwritten text
Text color :[Red text]{color=red} Red text
Text size :[This text is size 7]{size=36pt} This text is size 7
Highlight text ==This text is highlighted== This text is highlighted
Strikethrough ~~This text is struck through~~ This text is struck through
Underline ++This text is underlined++ This text is underlined
Subscript H~2~O H2O
Superscript x^2^ x2

Text alignment

Description Syntax Result
Text wrapping :[This text floats to the right]{float=right} This text floats to the right
Align block to the left :::left
text
:::
Left
Align block to the right :::right
text
:::
Right
Align block to the center :::center
text
:::
Centered
Collapsible (expands on click) :::spoiler
Show spoiler

This text is collapsed
:::
Show spoilerThis text is collapsed
Code block ```
var i = 10;
```		 
var i = 10;
Description Syntax Result
Link <https://stocksharp.com/en/> https://stocksharp.com/en/
Link with text [StockSharp site](https://stocksharp.com/en/) StockSharp site
Email link <info@stocksharp.com> info@stocksharp.com
Email link with text [Write to me](mailto:info@stocksharp.com) Write to me
Link to a topic by id @topic(12374) Assign, install and work with StockSharp Installer.
Link to a message by id @message(51317) Assign, install and work with StockSharp Installer.
Link to a product by id @product(9) Designer
Link to a user by id @user(1) StockSharp
Link to a file by id @file(122179) cup.svg
Auto-link (a bare URL becomes a link on its own) https://stocksharp.com/en/ https://stocksharp.com/en/

Images

Description Syntax Result
Image by url ![](https://stocksharp.com/file/122179/cup_svg/)
Image by url with a tooltip ![](https://stocksharp.com/file/122179/cup_svg/ "This is an arbitrary tooltip.")
Image by id ![](122179)
Image by id with a tooltip ![](122179 "This is an arbitrary tooltip.")

Image size — via {style="..."}: width width, height height, or both. The size is visible in regular text (inside a table cell an image is limited to the cell width):

![](122179){style="width:80px"} ![](122179){style="width:200px"}

Lists

Description Syntax Result
Bulleted - Item 1
- Item 2
- Item 3
  • Item 1
  • Item 2
  • Item 3
Numbered 1. Item 1
2. Item 2
3. Item 3
  1. Item 1
  2. Item 2
  3. Item 3
With letters a. Item 1
b. Item 2
c. Item 3
  1. Item 1
  2. Item 2
  3. Item 3
With Roman numerals i. Item 1
ii. Item 2
iii. Item 3
  1. Item 1
  2. Item 2
  3. Item 3

Headings and blocks

Description Syntax Result
Headings (levels 1–6) ## Heading
###### Small

Heading

Small
Quote > This is a quote
This is a quote
Horizontal line ---
Task list - [ ] Not done
- [x] Done
  • Not done
  • Done
Footnote Text[^1]
[^1]: Explanation		 Text1

Social media

youtube

::iframe{url=https://www.youtube.com/embed/lsbyvqajlZ8}

vimeo

::iframe{url=https://player.vimeo.com/video/60238948}

fb

::iframe{url=https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2Fstocksharp%2Fposts%2F4554987014515465&width=500}

Diagrams

A Designer scheme straight in the text. The site draws it in the browser, so it can be zoomed in on and studied: it is not a picture. A scheme is taken either by reference — a file on the site by id or an address on the internet — or pasted as its JSON straight into the message.

Description Syntax Result
Designer diagram by file id or URL @diagram(URL) see the live example below the table
Scheme directly in text: JSON inside a code block, without a file or link ```diagram
{"Content":{"Value":{"Scheme":{"Model":{"Nodes":[{"Key":"2","TypeId":"95b3aefe-23fd-4cee-b49e-09764f2ab2e2","X":-350,"Y":-290,"Settings":{"Parameters":{"Name":{"Value":"Security"}}}},{"Key":"3","TypeId":"3d773273-0cee-4d40-8eef-acded2d07ab8","X":-90,"Y":-290,"Settings":{"Parameters":{"Name":{"Value":"TimeFrameCandle"}}}}],"Links":[{"From":"2","FromPort":"Output","To":"3","ToPort":"Security"}]}}}}}
```		 see the live example below the table

Live example (Designer scheme from the AlgoTrading repository):

Live example of an inline scheme (the same JSON directly in text):

If the scheme could not be obtained, the token itself stays on the page — @diagram(122179), for instance. That means there is no file with that id, or the address is unreachable.

Page sections

Blocks for product pages and landings. Each one takes the full column width and styles itself — nothing has to be laid out by hand.

Description Syntax
Two columns: image on the left, text on the right :::feature-left
![](123456)

### Heading
* Item
:::
The same, image on the right :::feature-right
…
:::
The same on a tinted band — alternate them so that a long page reads as a sequence of sections :::feature-left alt
…
:::
A grid of cards — one card per ### :::cards
### Title
Description
:::
A row of large figures — one value \| caption line each :::stats
70+ \| indicators
Free \| price
:::
Numbered steps — one step per ###, the numbers are added automatically :::steps
### Download
Step text
:::
Buttons — every link becomes a button, the first one is the primary :::cta
[Download](/en/products/download/)
[Documentation](https://doc.stocksharp.com/)
:::
Quote with a signature — a line starting with a dash becomes the author :::quote
Review text.

— Name, position
:::
Two screenshots of the same screen in one frame (light and dark theme) :::split
![](107133)

![](107134)
:::

Inside :::feature-* the first media block — an image, a video or a diagram — goes to the illustration half, everything else to the text half. A :::split pair also counts as a media block, so it can be put into :::feature-* instead of a single image.

What it looks like. Below are the same blocks, not in a table but live.

7
site languages
2
themes
Free
price of the platform

Card

A short text under the heading. There can be any number of cards — they lay themselves out on the grid.

Another one

The column width adapts to the screen: on a phone the cards line up in a single column.

The third one

Regular markup works inside a card — bold, italic, links.

1

First step

The number is added automatically; it is not present in the markup.

2

Second step

The steps go in the order the headings are written in.

3

Third step

If a step is inserted in the middle, the rest are renumbered automatically.

Markup should be such that the author thinks about the text, not about the layout.

From a discussion of this help page
Product catalogDocumentation

Site data

Numbers and names the site fills in itself as the page is served. Nothing here has to be kept up to date by hand: the value always comes from the catalogue, not from what somebody typed once.

Description Syntax Result
How many connectors @connector_count 74
How many indicators @indicator_count 166
How many strategies @strategy_count 867
How many applications @app_count 8
How many users @user_count 31,827
A product's name in the page's language — as text, without a link @product_name(9) Designer

The number is written the way the page's language writes it, with a thousands separator. If the value could not be obtained, the token itself stays on the page — @connector_count, for instance. The editor notices that, and it never turns into a wrong figure: a zero in "we support 0 connectors" would read as a fact.

@product_name(NNN) differs from @product(NNN) in that it inserts the name alone and makes no link. That is what a sentence needs in the middle: "Designer has a visual strategy designer", where @product(9) would give the link Designer.