Having just implemented code syntax highlighting in this blog in addition to Textile formatting, I thought I’d share how I did it.
After a little research, I decided that Arya Asemanfar’s tm_syntax_highlighting plugin looked the most promising. Arya’s blog post about it was particularly helpful.
Install the oniguruma system library (see link in the plugin README).
Install the ultraviolet gem, which will also install the textpow and oniguruma gems.
sudo gem install ultraviolet
./script/plugin install git://github.com/arya/tm_syntax_highlighting
./script/generate syntax_css
# config/initializers/tm_syntax.rb TmSyntaxHighlighting.defaults = {:theme => "mac_classic", :line_numbers => false, :lang => "ruby"}
Note: I have used “c0de” instead of “code” here just to enable this code to be parsed!
# app/helpers/application_helper.rb def parse_textile_and_code_syntax(text) text_pieces = text.split(/(<c0de>|<c0de lang="[A-Za-z0-9_-]+">|<c0de lang='[A-Za-z0-9_-]+'>|<\/c0de>)/) in_pre = false language = nil text_pieces.collect do |piece| if piece =~ /^<c0de( lang=(["'])?(.*)\2)?>$/ language = $3 in_pre = true nil elsif piece == "</c0de>" in_pre = false language = nil nil elsif in_pre code(piece.strip, :lang => language, :theme => "mac_classic") else RedCloth.new(piece.strip).to_html end end end
<%= parse_textile_and_code_syntax(@blog_post.post) %>
pre { margin: 10px 10px; padding: 10px 10px; line-height: 15px; overflow: auto; font-family: "Monaco", "Courier New", courier; font-size: 12px; }
© 2023 Keith Pitty, all rights reserved.