SyntaxHighlighter Evolved

Description:

As seen on WordPress.com.

SyntaxHighlighter Evolved allows you to easily post syntax-highlighted code to your site without having to escape the code or anything. It uses the SyntaxHighlighter JavaScript package by Alex Gorbatchev to do the highlighting and supports all of the package’s parameters via shortcode attributes.

For a list of supported languages (most widely used languages are supported), see the WordPress.com support document.

Example Code Output:

Note that there are various different color schemes available.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>PHP Code Example</title>
</head>
<body>
	<h1>PHP Code Example</h1>

	<p><?php echo 'Hello World!'; ?></p>

	<p>This line is highlighted.</p>

	<div class="foobar">
		This	is	an
		example	of	smart
		tabs.
	</div>

	<p><a href="http://wordpress.org/">WordPress</a></p>
</body>
</html>

If you prefer, you can hide the line numbering and other UI stuff with the “light” mode, for example:

[php light="true"]your code here[/php]

There are many other parameters and defaults you can control via the Settings page or the shortcode parameters. Full details and instructions are located at the bottom of the Settings page.

Download:

GitHub:

This plugin is available on GitHub. Issues, patches, and pull requests are welcome.

https://github.com/Viper007Bond/syntaxhighlighter

1,818 thoughts on “SyntaxHighlighter Evolved”

  1. Pingback: Clojure Highlighting On Wordpress « Mental Pandiculation

  3. Hi! We’re using this Plugin but there is a bug: “Error #2044: IOErrorEvent unverarbeitet. text=Error #2036: Ladevorgang nicht abgeschlossen.”
    This Error come ever the mousecursor comes over the copy-button. Note: I’m using the Google-Chrome-Browser. I hope you fix this!

  4. Pingback: /dev/blog » SyntaxHighlighter Evolved and line-height

  5. Pingback: Wordpress Gönderilerinde Kodlar?m?z? Renklendirelim | t-infection.com | tasar?m oyuncaklar?, web teknolojileri

  6. Pingback: Wordpress Gönderilerinde Kodlar?m?z? Renklendirelim | SohbeTCix.NeT | Chat Sohbet Muhabbet Odalar?

  7. Pingback: WordPress?????????????????? « tande lab.

  8. Pingback: ????????? ??????? PHP+JavaScript+HTML+CSS » ??????? ??? ????????? ???? ? WordPress’?

  9. Pingback: ????????????? - Asazuki???-PC

    • I don’t understand what you mean, but issues are usually caused by other plugins or perhaps a theme. Disable all other plugins and if that doesn’t work, try the default theme. You may also want to try using HTML view instead of the Visual editor.

  12. sorry, should have been more specific: I’m looking for a *vertical* scrollbar, in addition to the horizontal one. for example, if I have a 300-line code snippet, I want to show 50 lines, and have the user scroll to read the remaining 250 lines. the only option I could find in the settings was:

    “Wrap long lines (disabling this will make a scrollbar show instead)”

    thanks for the quick reply!

    • That’s not possible, although you may try wrapping the shortcodes in a div with a fixed height. That might accomplish what you’re looking for.

      If not, try the collapse code boxes option (it’s not what you want, but will avoid long blocks of text).

  13. Pingback: Wordpress · Test du plugin Wordpress SyntaxHighlighter Evolved

  14. thanks for the confirmation. i was hoping to avoid a div tag wrapper, but it works fairly well. it’s not perfect though, because the horizontal scroll bar is nested within the div wrapper, which looks a bit odd.

    for others facing this problem, here’s the div i used:

    code here

    to remove gaps between the code area and the parent div, I also had to update the code in shCore.css as follows:

    .syntaxhighlighter
    {
    width: 100% !important; /* 99% fixes IE8 horizontal scrollbar */
    margin: 0 0 0 0 !important;
    padding: 0 !important; /* adds a little border on top and bottom */
    position: relative !important;
    }

    in future, i would love to see an option to set the number of visible lines. e.g., if i put 200 lines into this code:

    

    then only 50 would show up. to see the remaining 150 lines, the user would have to scroll down with a vertical scrollbar.
    

    thanks for a great plugin!
    

    

			
    
							
    
		
    

	

    15. 
	
  15. 
		
    
			

			
    looks like the comments interpreted my sh tags. the two code examples in the previous post should read:
    

    <div style=”overflow:auto;height:300px;>
    
[j a v a]code here[/j a v a]
    
</div>
    

    and:
    

    [j a v a lines=50]
    
[/j a v a]
    

    

			
    
							
    
		
    

	
    16. 
	
  16. 
		
    Pingback: ????hatena??wordpress – t11a blog
    
	
    17. 
	
  17. 
		
    
			

			
    i see. is alex still maintaining the code? got a url?
    

    btw, the “copy to clipboard” feature seems to be using flash, and it’s generating lots of warnings and errors. i get:
    

    Warning: ‘flash’ has no property ‘prototype’
    
Warning: ‘StageVideo’ has no property ‘prototype’
    
Warning: ‘AsBroadcaster’ has no property ‘addListener’
    
Warning: ‘AsBroadcaster’ has no property ‘removeListener’
    
Warning: ‘this’ has no property ‘_visible’
    
Warning: ‘this’ has no property ‘_visible’
    
Warning: Reference to undeclared variable, ‘highlight_mc’
    
Warning: Reference to undeclared variable, ‘highlight_mc’
    
Warning: onSetFocus is not a function
    
Warning: myOnSetFocus is not a function
    
Warning: onKillFocus is not a function
    
Warning: onSetFocus is not a function
    
Warning: myOnKillFocus is not a function
    
Warning: myOnSetFocus is not a function
    
Warning: onKillFocus is not a function
    
Warning: myOnKillFocus is not a function
    
Warning: ‘flash’ has no property ‘prototype’
    
Warning: ‘StageVideo’ has no property ‘prototype’
    
Warning: ‘AsBroadcaster’ has no property ‘addListener’
    
Warning: ‘AsBroadcaster’ has no property ‘removeListener’
    
Warning: ‘flash’ has no property ‘prototype’
    
Warning: ‘StageVideo’ has no property ‘prototype’
    
Warning: ‘AsBroadcaster’ has no property ‘addListener’
    
Warning: ‘AsBroadcaster’ has no property ‘removeListener’
    

    and on google chrome, under flash player 10.1.53.7 i get this error:
    

    Error #2044: Unhandled IOErrorEvent:. text=Error #2036: Load Never Completed.
    

    (i run the debug version of the player. most people won’t see the error.)
    

    looks like it might be actionscript 2? would that be alex’s domain too?
    

    anyway, until this is fixed, is there any way to disable just the clipboard feature (not the entire toolbar)? is that another feature request for alex?
    

    colin
    

    

			
    
							
    
		
    

	
      
	
    • 
		
      
			

			
      Yes, all of the visitor facing stuff is him. Check out the top of this page for a link to his site. He is currently developing a new version of the highlighter.
      

      

			
      
							
      
		
      

	
      • 

    

    18. 
	
  18. 
		

	
    19. 
	
  19. 
		

	
    20. 
	
  20. 
		
    
			

			
    I’d been trying to output this statement.
    

    <img src='dummy.jpg' height='200' width='400' />
    

     But e  always shows up with < > instead
    

    

			
    
							
    
		
    

	
      
	
    • 
		

	
        
	
      • 
		
        
			

			
        Hi, I tried publishing the post after I saw the comment here turned out fine. And it works! However, it doesn’t render well in preview mode.
        

        But that’s no big issue anyway. Thanks.
        

        

			
        
							
        
		
        

	
        • 

      

      • 

    

    21. 
	
  21. 
		
    
			

			
    We installed SyntaxHighlighter Evolved plugin but still it is not showing up the PHP code. Even after uninstalling it, WordPress 3 is running PHP Codes in posts. WP3 does support code and pre functions right? Please take a look – HowToDoWiki PHP Post
    

    

			
    
							
    
		
    

	

    22. 
	
  22. 
		
    Pingback: Mill Coisas » Blog Archive » Plugins Legais para WordPress
    
	
    23. 
	
  23. 
		
    
			

			
    I LOVE the look of this plugin, unfortunately it would not work properly on my blog. When I would preview, it looked fine. However, after saving the draft special characters were changed. Here are the images of what I’m talking about…
    

    http://shinytype.com/images/code-good.jpg
    
http://shinytype.com/images/code-bad.jpg
    
(I use the PHP shortname tags around the code)
    

    This does not happen when I use the CodeColorer plugin – which works, but doesn’t look nearly as good as yours and doesn’t have much functionality. Maybe it works because it utilizes the  tags natively?
    

    I'd be elated if I just weren't doing something correctly or if there was something I could do to rectify this. Thank you for your time!
    

    

			
    
							
    
		
    

	
      
	
    • 
		
      
			

			
      Crap. I feel a bit embarrassed – posted this on the wrong plugin page. I thought these were the same plugins for some reason (apparently because I’m a retard?) hehe. The GOOD news, however, is that THIS plugin works brilliantly! Solved the problem. You rock, sir! 🙂  (…still horrendously embarrassed though, haha)
      

      

			
      
							
      
		
      

	

      • 

    

    24. 
	
  24. 
		
    Pingback: PHP – Code to read comma delimited files « idkwut?
    
	
    25. 
	
  25. 
		

	

    26. 
	
  26. 
		
    
			

			
    Scribe Fire is a “Blog Editor” for Firefox. If i post php code (exemple: 
    

     CODE PHP 
    

     from scribe fire or other blog editor) this have incorrect syntax.
    

    

			
    
							
    
		
    

	
    27. 
	
  27. 
		
    
			

			
    hey!
    
I’ve just installed this plugin to my wordpress but there aooears to be a problem, no matter what the language type is, plugin puts random newlines in codes and 3 lines of code becomes 6-7 lines of code;
    

    This code appears like;
    

    I could not figure it out, and wonder what the problem is.
    
It would be appriciated if you can help me with this problem.
    

    p.s I’ve tried disabling all other plugins but did not work..
    

    

			
    
							
    
		
    

	
      
	
    • 
		
      
			

			
      Since it’s working on my blog, then it’s very likely not my plugin at fault.
      

      Did you have all other plugins disabled when you wrote the post? If you edit the post, does it look correct or does it have the line breaks? (view in HTML mode to be sure)
      

      

			
      
							
      
		
      

	
      • 

    

    28. 
	
  28. 
		
    
			

			
    oops forget the codes
    

    <?php
$connect = mysql_connect($host,$user,$pass);
$db = mysql_select_database($database,$connect);
?>

    

    looks like
    

    <?php
$connect 
= mysql_connect(
$host,$user,$pass
);
$db 
= mysql_select_database(
$database,$connect
);
?>

    

    annoying..
    

    

			
    
							
    
		
    

	
    29. 
	
  29. 
		
    
			

			
    I’ve tried disabling all other plugins and posting a new one but I figured out that installing the plugin to a fresh intallation of WP solves the problem.  I guess one of my plugins affects syntaxhighlighter and disabling it does not work for it, anyway thanks for the fast reply if I find out which plugin makes it malfunciton I’ll post it here so that people would know what plugin to install.. 🙂
    

    

			
    
							
    
		
    

	

    30. 
	
  30. 
		
    Pingback: ???????? ??????????? ?????? ? WordPress | ???? ? ???-???????
    
	
    31. 
	
  31. 
		
    
			

			
    Viper,
    
Alex released a beta (http://twitter.com/syntaxhighlight) of the 3.o release at
    
http://bitbucket.org/alexg/syntaxhighlighter/src . Are you planning on supporting the new options any time soon?
    
Thanks for a great plugin.
    

    PS: Here is a small feature request for the next version. To match my site, I tweak the default syntax theme CSS file. This obviously gets overwritten with every update of yours. Is there a way that you can support picking up a user’s CSS from a different location out of the plugin dir? WPTouch does this for icons. They use /wp-content/uploads/wptouch/custom-icons/.
    

    

			
    
							
    
		
    

	
      
	
    • 
		
      
			

			
      I will not be supporting the new version of his highlighter until it goes out of beta.
      

      I’m currently recoding another plugin (Video Quicktags) and when I’m done with that one, I’ll begin work on updating this one in preparation for his release.
      

      

			
      
							
      
		
      

	
      • 

    

    32. 
	
  32. 
		
    
			

			
    Hi Alex, first of all, rocking plugin. I’ve tried many others and yours is definitely the easiest to use with the best looking results. But I’ve come across a rather odd problem. I find that certain characters (or combination of them) will break the post altogether, resulting in a 404 page. Examples of characters (each enclosed in parentheses) include (/=) and (; //).
    

    I don’t think this has anything to do with the plugin per se, since the other syntax plugins have also shown this error on the same characters. I’ll be doing some testing tomorrow to check localhost and WP versions, but I have a stinking suspicion that it’s related to my domain. Have you heard of anything like this before?
    

    

			
    
							
    
		
    

	

    33. 
	
  33. 
		
    Pingback: System Log Of ???? » ?wordpress????
    
	
    34. 
	
  34. 
		
    Pingback: Syntax Highlighting
    
	
    35. 
	
  35. 
		
    Pingback: Wordpress Blog on GoDaddy webhost – A walkthrough « Greeen Notes
    
	
    36. 
	
  36. 
		
    Pingback: cyberzeddk » What’s cooking in my install…
    
	
    37. 
	
  37. 
		
    
			

			
    Hi Viper,
    
I installed and activated your plugin (v2.3.8) and akismet (v2.2.7) into WordPress (v 2.9.2) and all the categories disappear in the display on my blog and in the admin category section. I then deactivated both plugins one at a time and still no resolution however when I then delete your plugin files the categories reappear in the front and backend. I am puzzled do you know of this issue or what may be causing it? I thought at first it could be my theme but the issue was in the admin also. Any help would be appreciated as I would love to use your plugin as well as akismet.
    

    Thanks
    

    

			
    
							
    
		
    

	
      
	
    • 
		
      
			

			
      I don’t see how my plugin files existing while the plugin is deactivated could cause any problems. Plus, the plugin is in use on my blog as well as all of WordPress.com and it doesn’t have any issues on either. It’s worth trying it using the default theme just incase.
      

      

			
      
							
      
		
      

	

      • 

    

    38. 
	
  38. 
		
    Pingback: Posts per Year with Excerpt (Wordpress, PHP) « Franz Moser's Blog
    
	
    39. 
	
  39. 
		

	

    40. 
	
  40. 
		
    Pingback: Wordpress · Plugin SyntaxHighlighter Evolved
    
	
    41. 
	
  41. 
		

	

    42. 
	
  42. 
		
    Pingback: Syntax Highlighter « ocnihs???????
    
	
    43. 
	
  43. 
		
    Pingback: Syntax highlighting con wordpress: esempio - Lillo's blog
    
	
    44. 
	
  44. 
		

	
    45. 
	
  45. 
		
    Pingback: Posting Source Code in Wordpress with SyntaxHighlighter Evolved and Hungred Smart Quotes | The Inner Qube
    
	
    46. 
	
  46. 
		
    Pingback: SyntaxHighlighter for GWT at Blue Diamonds FX
    
	
    47. 
	
  47. 
		
    Pingback: Cool and very useful plugins a wordpress blog must have | kahITano.net
    
	
    48. 
	
  48. 
		
    Pingback: wordpress « ??
    
	
    49. 
	
  49. 
		
    Pingback: My WordPress Setup — Spencer Finnell
    
	
    50. 
	
  50. 
		
    Pingback: Syntax Highlight: a test : emergent commerce and technology
    
	
    51. 
		


				
		
	
			
Comments are closed.