/plugin-codetabs

Multiple languages code blocks for GitBook

Primary LanguageJavaScript

codetabs

Include multiple languages code block to your GitBook (for example when documenting an API).

Preview

Installation

Adds the plugin to your book.json, then run gitbook install if you are building your book locally.

{
    "plugins": ["codetabs"]
}

Usage

This is a code block with tabs for each languages:

{% codetabs name="Python", type="py" -%}
msg = "Hello World"
print msg
{%- language name="JavaScript", type="js" -%}
var msg = "Hello World";
console.log(msg);
{%- language name="HTML", type="html" -%}
<b>Hello World</b>
{%- endcodetabs %}

Escaping templating syntax

For languages using syntax like {{, {%; we have to escape these content:

Here is some angular and react code

{% codetabs name="Python", type="py" -%}
    {% raw %}
    <h1>Hello {{yourName}}!</h1>
    {% endraw %}
{%- language name="React", type="js" -%}
var React = require('react')
{%- endcodetabs %}