Poniżej kroki, które należy wykonać:
1. Logujemy się na nasze konto na blogger.com.
2. Wchodzimy w zakładkę Układ a następnie Edytuj kod HTML.
3. W sekcji <head> umieszczamy następujący kod:
<link href='http://syntaxhighlighter.googlecode.com/svn/trunk/Styles/SyntaxHighlighter.css' rel='stylesheet' type='text/css'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shCore.js'/>
4. Następnie pod powyższym kodem dodajemy wpis odpowiedni za kolorowanie danego języka. Jeżeli chcesz możesz wpisać wszystkie wiersze poniżej. Będziesz miał wtedy do dyspozycji wszystkie składni. Jednak jeżeli będzie używał np. tylko PHP to wklej tylko wiersz odpowiedzialny za tą składnie:
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushBash.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCSharp.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCpp.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCss.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushDelphi.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushGroovy.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJScript.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJava.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPhp.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPython.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushRuby.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushScala.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushSql.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushVb.js'/>
<script language='javascript' src='http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushXml.js'/>
5. Ostatni już wpis należy dodać na końcu ciała strony, czyli przed tagiem </body>:
<script language='javascript'>
dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll('code');
</script>
6. Zapisujemy szablon strony i gotowe.
Teraz, za pomocą tagów pre lub textarea możesz dodawać swój kod. Poniżej przykład:
<pre name="code" class="php">Twój kod</pre>
Pamiętaj, że podczas pisania kodu należy zamienić znak < wpisem "<" a znak > ">"
W przeciwnym wypadku interpreter bloggera będzie próbował uruchomić Twój kod.
Jeżeli chcesz żeby to działało również na Firefoxie 3.0.5 który błędnie interpretuje ten kod, należy w szablonie strony na blogerze usunąć na samej górze tag DOCTYPE.
1 komentarz:
nie trzeba zamieniac znacznikow "<" i ">" zreszta jest to bardzo nie wygodne. wystarczy podczas pisania posta kliknac w opcje posta i zaznaczyc "pokaz dokladnie kod html". i po napisaniu posta z kodem udajemy sie do zajkladki "edytuj kod html" i wstawiamy tylko znaczki pre ... wsio i dziala ;-)
Prześlij komentarz