Pages

Thursday, May 15, 2014

Pretty Print in blogger

Pretty Print in blogger

 I was looking to provide a better way to render code in my blog.
Have found a good solution with the pretifier of google:
https://code.google.com/p/google-code-prettify/wiki/GettingStarted
http://google-code-prettify.googlecode.com/svn/trunk/README.html

Once it has been configured in blogger (see below in the post), you can highlight your code by adding the HTML code
<pre class="prettyprint">
your code
</pre>
HTML code can be added in blogger in this way:
In blogger, click on the button "HTML" at the left top place.
Then  add the tag code <pre... /pre> as described above.


Of course the javascript has to be make accessible from blogger.
I found two way to include this pretifier in my blog.

Using this approach the following code

public void test(){ String test = "hello"; }
would looks like:
public void test(){
   String test = "hello";
}

You can also add line number as explained in the getting started of google using : "prettyprint linenums".
The following code:
lines
of
code

would looks like:
  1. Many
  2. lines
  3. of
  4. code

Using gadget

This is explained at the following link
http://www.virtualzone.de/2012/09/how-to-use-prettyprint-to-format-source.html


The gadget is run when the topic is visualized. Which provide access to the google code prettyprint.


The script is executed when the topic is published.

Using template

 This is my prefer way.
Go to the administration place of blogger, select "template" then edit html.
Add the following line in your html template (I added it under header):



No comments:

Post a Comment