If you have a technical product, you may want to include snippets of code in your topics, either in HTML or any other programming language. And of course, if you include code, you want it to be output as is, and not interpreted by either our Textile parser or the browser HTML renderer.
So here’s how to output code as is:
Short inline code
The simplest way to output some code inline is to enclose it with at (@) characters.
For example:
...in HTML use @<strong> - </strong>@ to make text bold
will output:
…in HTML use <strong> - </strong>
to make text bold
Multiline code
To output multiple lines of code as is, start a paragraph with “bc.”.
For example:
bc. <!DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html>
Will result in this output:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html>
Multiline code that includes blank lines
Outputting multiple lines of code that includes blank lines is a bit trickier, because Textile normally ends any block/paragraph when it encounters a blank line. To tell Textile not to end the code block, use a double dot after bc instead of single dot, “bc..”.
However: this also means you have to be more explicit in ending your code block (obviously a blank line doesn’t do it anymore). Ending a code block started with “bc..” is done by starting the next paragraph with an explicit “p. “.
Highlighting pieces of code within code blocks
In a code block, all textile or HTML code will be output “as is”, so any code you add to do formatting within a code block won’t work. However, we introduced an extra trick that let’s you highlight a piece of code, which is useful for explaining how and where to make code changes.
You can highlight some code by including it within triple stars (***), e.g. including ***20px***
in your code will result in:
h1 {
color:#046688;
font-size:20px;
margin-top:0px;
margin-bottom:0px;
}
Need more help with this?
Don’t hesitate to contact us here.