Aby uzyskać ładne kolory we wstawianych listingach kodów źródłowych i za bardzo się nie namęczyć z własnoręczną edycją napisów korzystam z
http://google-code-prettify.googlecode.com
Usługa ta automatycznie rozpoznaje jaki język programowania został wybrany i odpowiednio go formatuje.
Instalacja takiego cudka na stronie jest banalna.
W szablonie strony (w przypadku bloggera Projekt->Edytuj kod HTML) wstawiamy między tagami <head> i </head>
Natomiast w tagu <body > dodajemy onload='prettyPrint()'<script src='http://google-code-prettify.googlecode.com/ svn/trunk/src/prettify.js' type='text/javascript'/><link href='http://google-code-prettify.googlecode.com/ svn/trunk/src/prettify.css' rel='stylesheet' type='text/css'/>
Część mojego szablonu po tych operacjach wygląda następująco:
...
<script src='http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js' type='text/javascript'/><link href='http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.css' rel='stylesheet' type='text/css'/>
</head>
<body expr:class='"loading" + data:blog.mobileClass' onload='prettyPrint()'>... Teraz wystarczy we wpisywanych notkach użyć:
<code class="prettyprint"> …… </code>Albo aby kod był w ramce:
<pre class="prettyprint"> …… </pre>
W miejsce kropek wstawiając kod źródłowy.
Oczywiście istnieje dużo możliwości konfiguracyjnych naszego formatowania ale na początek wystarczy to.
Brak komentarzy:
Prześlij komentarz