TiddlyWiki5/plugins/tiddlywiki/highlight/readme.tid

title: $:/plugins/tiddlywiki/highlight/readme

This plugin provides syntax highlighting of code blocks using v8.8.0 of [[highlight.js|https://github.com/isagalaev/highlight.js]] from Ivan Sagalaev.

! Usage

When the plugin is installed it automatically applies highlighting to all codeblocks defined with triple backticks or with the CodeBlockWidget.

The language can optionally be specified after the opening triple braces:

<$codeblock code="""```css
 * { margin: 0; padding: 0; } /* micro reset */

html { font-size: 62.5%; }
body { font-size: 14px; font-size: 1.4rem; } /* =14px */
h1   { font-size: 24px; font-size: 2.4rem; } /* =24px */
```"""/>

If no language is specified highlight.js will attempt to automatically detect the language.

! Built-in Language Brushes

The plugin includes support for the following languages (referred to as "brushes" by highlight.js):

* apache
* bash
* coffeescript
* cpp
* cs
* css
* diff
* http
* ini
* java
* javascript
* json
* makefile
* markdown
* nginx
* objectivec
* perl
* php
* python
* ruby
* sql
* xml

You can also specify the language as a MIME content type (eg `text/html` or `text/css`). The mapping is accomplished via mapping tiddlers whose titles start with `$:/config/HighlightPlugin/TypeMappings/`.
Improve plugin readmes Now every plugin has a short, introductory readme tiddler that is shown in the online plugin library. 2015-03-19 10:53:45 +00:00			`title: $:/plugins/tiddlywiki/highlight/readme`

Update to v8.8.0 of highlight.js 2015-09-11 18:53:06 +00:00			`This plugin provides syntax highlighting of code blocks using v8.8.0 of [[highlight.js\|https://github.com/isagalaev/highlight.js]] from Ivan Sagalaev.`

			`! Usage`

			`When the plugin is installed it automatically applies highlighting to all codeblocks defined with triple backticks or with the CodeBlockWidget.`

			`The language can optionally be specified after the opening triple braces:`

			<$codeblock code="""```css
			`* { margin: 0; padding: 0; } /* micro reset */`

			`html { font-size: 62.5%; }`
			`body { font-size: 14px; font-size: 1.4rem; } /* =14px */`
			`h1 { font-size: 24px; font-size: 2.4rem; } /* =24px */`
			```"""/>

			`If no language is specified highlight.js will attempt to automatically detect the language.`

			`! Built-in Language Brushes`

			`The plugin includes support for the following languages (referred to as "brushes" by highlight.js):`

			`* apache`
			`* bash`
			`* coffeescript`
			`* cpp`
			`* cs`
			`* css`
			`* diff`
			`* http`
			`* ini`
			`* java`
			`* javascript`
			`* json`
			`* makefile`
			`* markdown`
			`* nginx`
			`* objectivec`
			`* perl`
			`* php`
			`* python`
			`* ruby`
			`* sql`
			`* xml`
Improve plugin readmes Now every plugin has a short, introductory readme tiddler that is shown in the online plugin library. 2015-03-19 10:53:45 +00:00
Fix problem with highlight plugin language brushes TiddlyWiki passes the MIME type of the tiddler to highlight.js as the "language brush", but it turns out that highlight.js doesn't actually understand MIME types. This commit introduces a configuration mapping between common MIME types and highlight.js language brushes Fixes #2535 2016-08-18 08:07:06 +00:00			You can also specify the language as a MIME content type (eg `text/html` or `text/css`). The mapping is accomplished via mapping tiddlers whose titles start with `$:/config/HighlightPlugin/TypeMappings/`.