wtorek, 15 lipca 2008

Blogger i Syntax Highlighter

Niech pojawia się kolorki.
<pre name="code" class="java">
//Komentarz
public Klasa{
public static void main(String args[])
{
System.out.println("Hello World!"/*jakie to oryginalne*/);
}
}
</pre>

Zamieni sie na:

//Komentarz
public Klasa{
public static void main(String args[])
{
System.out.println("Hello World!"/*jakie to oryginalne*/);
}
}


Można to osiągnąć poprzez odwołanie do kodu SyntaxHighlighter z szablonu bloggera. Przechodzę do edycji szablonu bloga (Dostosuj -> Układ -> Edytuj Kod HTML).
  1. Najpierw potrzebne mi jest miejsce w sieci, gdzie umieszczę SyntaxHighlighter np. google pages, app engine lub dowolny inny darmowy hosting. Można też wykorzystać istniejące lokalizacje, próbowałem również odwołać się do SVN projektu, jednak plik css coś nie chciał współpracować, dlatego korzystam z googlepages.

  2. W kodzie html szablonu dodaje kod z odwołaniami do skryptów dla odpowiednich języków (umieszczam kod zaraz przed </body>). Dodatkowe języki (Scala, Bash etc.) mozna znaleźć w sieci.

<link href="'http://toolsmatter.googlepages.com/SyntaxHighlighter.css'" rel="'stylesheet'" type="'text/css'/">
<script language="'javascript'" src="'http://toolsmatter.googlepages.com/shCore.js'/">
<script language="'javascript'" src="'http://toolsmatter.googlepages.com/js/shBrushScala.js'/">
<script language="'javascript'" src="'http://toolsmatter.googlepages.com/shBrushXml.js'/">
<script language="'javascript'" src="'http://toolsmatter.googlepages.com/shBrushShell.js'/">
<script language="'javascript'" src="'http://toolsmatter.googlepages.com/shBrushJava.js'/">
<script language="'javascript'" src="'http://toolsmatter.googlepages.com/shBrushSql.js'/">
<script language="'javascript'" src="'http://toolsmatter.googlepages.com/shBrushJScript.js'/">


<script language="'javascript'">
dp.SyntaxHighlighter.ClipboardSwf = 'http://toolsmatter.googlepages.com/clipboard.swf';
dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll('code');
</script>
Minus takiego podejścia jest prosty - zmiana szablonu wymaga odrobine pracy. Nie zmienia się szablonu często więc jest to ok. Jednak jedno wklejenie kodu uświadamia mi, ze ten blog potrzebuje szerszego szablonu.

ps. w przypadku kodu xml / html, trzeba zamieniać przed wysłaniem '<' na '&lt;'

Brak komentarzy: