Syntax Highlighting with scrolling at Blogspot

Question

I am using blogspot.com.
I want to make my coding highlighting.
So, I use google code prettify api.

<link href='http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.css' rel='stylesheet' type='text/css'/> 

 

<pre class="prettyprint"> ... my coding place ... </pre>

Everything is fine but I would like to make Scrolling (like ., style="overflow-x: scroll")

Please let me know where should I modify to make scrolling of my code at blogspot.com

Answer 1

Not sure about Google prettify but you can use SyntaxHighlighter and with small change your code will look nice: http://www.simplethoughtsonline.com/2012/01/syntaxhighlighter-and-blogger.html

Answer 2

For others looking for a solution to this problem - you should checkout:

http://oneqonea.blogspot.com/2012/04/how-do-i-add-syntax-highlighting-to-my.html

It's a really easy "SyntaxHighlighter for Blogger" tutorial with screenshots and everything.

You should be up and running in only a few minutes.

Answer 3

add to your css

.codescroll {
    overflow-x: scroll;
    overflow-y: scroll;
    max-height: 500px;
}

and then you can add more than one class to pre element :)

<pre class="prettyprint codescroll"> ... my coding place ... </pre>

that should do the trick