Embed code on a blogger post nicely

You want to display source code or text command on a blogger post nicely? Don't worry! You can use Prettify script to highlight code in your web pages. Some tutorials would suggest to directly embed Presttify into template file. But it would clutter your template code. There is a more elegant way, ie using blogger widget. Here are the steps:

1. At the Blogger.com Blog Administration, click "Layout" in the left navigation bar.
2. Click "Add Gadget" somewhere in your layout, preferably somewhere at the bottom of the page.
3. Choose "HTML/JavaScript" from the "Basics" tab.
4. Give your gadget a name (i.e. "PrettyPrint") and paste the code from below into the "Content" text area.
   

   <script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js?skin=sunburst"></script>
   

5. To display code snippet on your post, encode your code snippet into html entities. You can use online tool, for example htmlentities.net.
6. On post editing/creating screen, make sure you are on HTML mode, not Compose mode ,  then just place the code inside of a <pre class="prettyprint">...</pre> tag.

For more info, check this link: https://code.google.com/p/google-code-prettify/wiki/GettingStarted