Menu
I've been trying to install SyntaxHighlighter 3.0.83 on Blogger for couple hours. I've tried many tutorials but it still doesn't work. I mean it looks just as normal text inserted nto pre tag.
I created a new blog and pasted:
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'></script>
<script language="javascript" type="text/javascript">
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.all();
</script>
...just before closing head tag. The code pasted above had been generated here: generator
The strange thing is that it works in my own html document. As an example:
<html>
<head>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'></script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'></script>
<script language="javascript" type="text/javascript">
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.all();
</script>
</head>
<body>
<pre class='brush:java;'>import gt.memorize;
public class Test
{
private static final String test = "test";
}</pre>
</body>
</html>
But the same pre tag doesn't work on blogger.
I have also tried pasting
<script language="javascript" type="text/javascript">
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.all();
</script>
at the end of body and pasting styles at the end of b:skin tag. Neither works. And I don't paste the code into Compose part :) I'm very confused so any help will be extremely appreciated.
504
For dynamic views, the post's content seems to be loaded after the script that bootstraps the syntax highlight process. You can work around it:
<pre class="brush: js" title="test" id="sh3-123">
var f = function () {
return 1;
};
</pre>
<script type="text/javascript">
// code snippet is loaded here, use SH3 API to highlight it
var element = document.getElementById('sh3-123');
SyntaxHighlighter.highlight(undefined, element);
</script>
I had the same problem. The instructions to set up SyntaxHighlighter seemed easy enough. And all tutorials were more or less comparable including the comment "on my blog it works, if it doesn't work for you then you must be doing something wrong". Nothing worked for me, I got no highlighting.
The solution was to switch to another Blogger template. It just didn't work with the dynamic template I chose. Switching to a simple template did the trick. Highlighting now works.
By the way: While chasing for errors I also tried Prettify as an alternative. It also didn't work. Seems like the dynamic template did something which caused both syntax highlighters to fail.
36
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
