title |
---|
Code/Syntax Highlighting Helpers |
Slide Show (S9) lets you include and syntax highlight code
with the code
helper. Example:
<% code do %>
# The Greeter class
class Greeter
def initialize(name)
@name = name.capitalize
end
def salute
puts "Hello #{@name}!"
end
end
# Create a new object
g = Greeter.new("world")
# Output "Hello World!"
g.salute
<% end %>
becomes
1 # The Greeter class 2 class Greeter 3 def initialize(name) 4 @name = name.capitalize 5 end 6 7 def salute 8 puts "Hello #{@name}!" 9 end 10 end 11 12 # Create a new object 13 g = Greeter.new("world") 14 15 # Output "Hello World!" 16 g.salute
Slide Show (S9) ships with three built-in syntax highlighting helper engines letting you choose between client-side syntax highlighting in JavaScript (the out-of-the-gem factory setting) or server-side ahead-of-time syntax highlighting in classic Ruby.
SyntaxHighligher is a free, open-source syntax highlighter in JavaScript:
Note, if you use the SyntaxHighligher engine you will need to
use the s6syntax
template pack that includes the SyntaxHighlighter machinery or as an alternative
bundle up your own template pack.
Ultraviolet is a free, open-source syntax highlighting engine in Ruby that uses Textmate syntax files offering out-of-the-gem syntax highlighting for more than fifty languages in twenty themes:
To use Ultraviolet for syntax highlighting install the Ruby gem e.g.
$ gem install ultraviolet
and switch the code-engine
setting to uv
or ultraviolet
.
CodeRay is another free, open source syntax highlighting engine in Ruby:
To use CodeRay for syntax highlighting install the Ruby gem e.g.
$ gem install coderay
and switch the code-engine
setting to coderay
.
The code
helper lets you include and syntax highlight code inline e.g.
Classic-style:
|
Django-Style:
|
or include code from a file - lets say hello.rb
:
``` <%= code 'hello.rb' %> ``` | ``` {% raw %}{{ code hello.rb }}{% endraw %} ``` |
To select the language (default is ruby
) use the :lang
option e.g.
``` <%= code 'effects.css', lang: => 'css' %> ``` | ``` {% raw %}{{ code effects.css lang=css }}{% endraw %} ``` |
Note, you can also include parts of files
using Codex-style markers
in your source (e.g. #START:your_marker_here
and
#END:your_marker_here
) and you can also pass along an extra CSS class
(large
, small
, tiny
, etc.) e.g. this directive in Codex
:code code/meta/my_ostruct.rb[impl class=code-small]
becomes in S9:
``` <%= code 'code/meta/my_ostruct.rb#impl', class:=>'small' %> ``` | ``` {% raw %}{{ code code/meta/my_ostruct.rb#impl class=small }}{% endraw %} ``` |
To select the underlying engine for syntax highlighting use the :engine
option e.g.
``` <%= code 'highlight.rb', :engine => 'sh' %> ``` | ``` {% raw %}{{ code highlight.rb engine=sh }}{% endraw %} ``` |
or use a header to set it once e.g:
code-engine: sh # or use your very own code engine here
You can also use the built-in code highlighting engines "stand-alone" without the code "wrapper" helper.
To use SyntaxHighlighter use:
<% sh do %>
puts 'Hello World!
<% end %>
To use Ultraviolet use:
<% uv do %>
puts '¡Hola Mundo!
<% end %>
To use CodeRay use:
<% coderay do %>
puts 'Hallo Welt!
<% end %>
Note, that the sh
, uv
and coderay
helpers
only support inline code (if you want to include code use a nested include e.g.:
<% sh :lang => 'css', :line_numbers => 'off' do %>
<%= include 'gradients.css' %>
<% end %>
For more options or on how to write your own syntax highlighting helpers check the source of the syntax higlighting helpers.