Zapewne zastanawiacie się w jaki sposób można formatować kod na blogu tak, aby nie urągał standardom IDE. Blogger umożliwia edycję własnych szablonów (templatek) w html'u - możemy więc dodawać własne skrypty oraz szablony CSS.
Aby nie wynajdować koła na nowo posłużymy się dostarczającą nam tych możliwości biblioteką SyntaxHighlighter, dostępną pod linkiem:
http://alexgorbatchev.com/SyntaxHighlighter/
Aby nie wynajdować koła na nowo posłużymy się dostarczającą nam tych możliwości biblioteką SyntaxHighlighter, dostępną pod linkiem:
http://alexgorbatchev.com/SyntaxHighlighter/
Wchodzimy w edycję szablonu aktualnie uruchomionego na naszym blogu. Zakładamy, że na jakimś zewnętrznym serwerze udostępniamy wszystkie zasoby z biblioteki SyntaxHighlighter ( u nas dostępne pod adresem : http://boot-transl8.rhcloud.com/syntaxhighlighter/). W edytowanej templatce znajdujemy koniec taga i bezpośrednio przed nim dołączamy podstawowe moduły - zakładamy formatowanie kodu JavaScript, dlatego wybraliśmy bibliotekę shBrushJScript.js:
<head> <link href="http://boot-transl8.rhcloud.com/syntaxhighlighter/styles/shCore.css" rel="stylesheet" type="text/css"></link> <link href="http://boot-transl8.rhcloud.com/syntaxhighlighter/styles/shCoreDefault.css" rel="stylesheet" type="text/css"></link> <script src="http://boot-transl8.rhcloud.com/syntaxhighlighter/scripts/shCore.js" type="text/javascript"></script> <script src="http://boot-transl8.rhcloud.com/syntaxhighlighter/scripts/shBrushJScript.js" type="text/javascript"></script> <script language="javascript" type="text/javascript"> SyntaxHighlighter.config.bloggerMode = true; SyntaxHighlighter.all(); </script> </head>
W zasadzie to wszystko co musimy zrobić - wystarczy sprawdzić czy działa to działa, dodając w tworzonym poście html'owy kod:
<pre class="brush:javascript">
var x = 1;
</pre>
Co powinno zostać wyświetlone następująco:
var x = 1;
Brak komentarzy:
Prześlij komentarz