Tinderbox v9 Icon

Exporting code samples

Normally, Tinderbox lets you embed html in your notes, and exports that embedded HTML without change.

Spans of $Text using the note's 'Code' font (as in $CodeFont) are now exported with <code> tags. The markup applied is determined by $HTMLCodeStart and $HTMLCodeEnd. The Style tab of the Export Inspector lets you edit these.

Inline code examples

Sometimes, though, you want to show an example of your HTML (or some other programming language) on a web page. That means you want the HTML tags to appear as you see them in Tinderbox, i.e. you see the character sequence "<b>", not the effect of bolding some text.

Originally, setting $HTMLQuoteHTML to false let you export HTML examples in an entire note. But, sometimes, you want the example to be handled differently than the rest of the note so $HTMLQuoteHTML is deprecated in favour of the following usages:

Setting $HTMLQuoteHTML to true will override this feature, so do not mix the two!

Opening angle brackets of tags with in <code> and/or <pre> sections

Although a single left angle bracket < can be typed literally in text, e.g. used as a less than sign, in all other cases it must be entered into the $Text as an encoded entity '<code>&</code><code>lt;</code>'. So, a < followed immediately by anything other than a space or number character must be entered as '<code>&</code><code>lt;</code>' or it may be exported incorrectly. for this reason, nearly all of the many < in the source $Text of this article required the character to be HTML-encoded in the $Text so as to render correctly in the exported text.

Therefore, '<code>&lt;</code>' encoding of a tag opening must be used even inside sections of text enclosed by <code> and/or <pre> tags. Why should this matter inside code samples? Consider these two examples where the sample includes HTML styling tags <b> and </b>:

Using the newer $Text 'Code' font option does not remove the need to check < characters inside the code-styled text.

This requirement to encode < characters opening tags is true not just for HTML code samples but any code where < and > are use to indicate inline tags, eg., XML, OPML, etc.

Code samples and paragraph spacing

Note that if you use <code> for a single line sample, you will not emit a wrapping <p> tag as Tinderbox does not emit an 'auto-paragraph' if:

So, if you want such a single line code example emitted as a separate paragraph, place an option+space at the end of the line after the </code> tag. Tinderbox will detect this and add the <p> tags Also, if such a line also starts with a tab it will use your TBX's defined indented-paragraph styling.

Whole note code samples

Alternatively, you may have a note consisting entirely of code (HTML, XML, etc) that needs to be exported verbatim, e.g. as is a boilerplate include to a larger exported page. In this case the best approach is to turn off $HTMLMarkupText (i.e. set to false). This should ensure the pages characters are exported untouched. However, characters outside the low ASCII set, such as a • may get transposed to a Unicode-style HTML entity.

Notes using lists

If you want to use $HTMLMarkupText but have paragraphs starting with *, # or • you can just set $AutomaticIndent to false. This essentially suppresses Quick List functionality.



A Tinderbox Reference File : Export : Exporting code samples