In html

Define the code

Put your code inside template tag with colorcode attribute:

Parameters of colorcode:

Then you set colorcode="parameters" it define which tab to show. if parameters not set, only code shows.

Active tabs

By default, only first tab is active. If you want to set active other tabs too, define it with separate attribute.

js="true" css="true" result="true" - if specified the folowing will be active (shows the code)

nosize

By default every tab resizing. Adding "noresize" cancel resizing (except result tab)

In javaScript

  1. Include colorCode.js
  2. dom - may be dom id, template it self or empty (document)

  3. Run colorCode - new colorCode(dom)
You can customize style of colorcodes elements by - [colorcode] {..}

Customize colors

Second parameter in colorCode is colorsObj that allows to customize colors of code.
By default the colors are: