
{"id":946,"date":"2009-05-06T09:00:21","date_gmt":"2009-05-06T08:00:21","guid":{"rendered":"http:\/\/www.matthijskamstra.nl\/blog\/?p=946"},"modified":"2009-05-28T23:45:53","modified_gmt":"2009-05-28T22:45:53","slug":"updated-syntaxhighlighter","status":"publish","type":"post","link":"https:\/\/www.matthijskamstra.nl\/blog\/2009\/05\/06\/updated-syntaxhighlighter\/","title":{"rendered":"Updated Syntaxhighlighter"},"content":{"rendered":"<div class=\"update\"><strong>Update #1:<\/strong> hmmmm, stupid but I write these post sometimes weeks ahead&#8230;. and this one caught up on me&#8230; The new version of SyntaxHighlighter Evolved has ActionScript support.. \ud83d\ude42<\/div>\n<div class=\"update\"><strong>Update #2:<\/strong> I could remove everything below, but I&#8217;m keeping this here, perhaps someone can use it&#8230;. and it took some time to write, so I really can&#8217;t kill my darlings.<\/p>\n<p>A little change I made to the new updated plugin:<br \/>\nfind the plugin-folder &#8220;syntaxhighlighter&#8221; and add the next line to &#8220;syntaxhighlighter.php&#8221;<br \/>\n[as highlight=&#8221;1,3&#8243;]<br \/>\n&#8216;as&#8217; \t\t\t=&gt; &#8216;as3&#8217;,<br \/>\n&#8216;as3&#8217;           =&gt; &#8216;as3&#8217;,<br \/>\n&#8216;actionscript&#8217;  =&gt; &#8216;as3&#8217;,<br \/>\n&#8216;actionscript3&#8217; =&gt; &#8216;as3&#8217;,<br \/>\n[\/as]<br \/>\n<strong>and<\/strong> find in the plugin-folder &#8220;syntaxhighlighter&#8221;, the folder &#8220;scripts&#8221; and change the next line to &#8220;shBrushAS3.js&#8221;<br \/>\n[as wrapper=&#8221;true&#8221;]<br \/>\n\/\/ SyntaxHighlighter.brushes.AS3.aliases\t= [&#8216;actionscript3&#8217;, &#8216;as3&#8217;]; \/\/ old line and the bottom of the .js file<br \/>\nSyntaxHighlighter.brushes.AS3.aliases\t= [&#8216;actionscript3&#8242;,&#8217;actionscript&#8217;, &#8216;as3&#8217;, &#8216;as&#8217;]; \/\/ new line<br \/>\n[\/as]<\/p>\n<p>the new syntaxhighlighter only uses &#8220;<code>as3<\/code>&#8221; and &#8220;<code>actionscript3<\/code>&#8220;, and I just changed all my post to &#8220;<code>as<\/code>&#8221;\n<\/div>\n<div class=\"update\"><strong>Update #3:<\/strong> and update the css, that made the code not wrap&#8230;.<br \/>\nI removed &#8220;white-space: pre;&#8221; form &#8220;code&#8221; and now it wraps:<\/p>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">\r\ncode  { font-family: &quot;Courier New&quot;, Courier, monospace; font-size: 1.2em; \/*white-space: pre;*\/ color: Gray; }\r\n<\/pre>\n<\/div>\n<p>Today I updated my <a href=\"http:\/\/alexgorbatchev.com\/wiki\/SyntaxHighlighter\">SyntaxHighlighter JavaScript package by Alex Gorbatchev<\/a> and it was not easy&#8230;<\/p>\n<p>I have a syntax highlighter installed on my blog to show my ActionScript source code in a nice way.<br \/>\nBut the first time I installed it, I choose a WordPress plugin which isn&#8217;t add to <a href=\"http:\/\/wordpress.org\/extend\/plugins\/\">WordPress Plugin Directory<\/a>and doesn&#8217;t appear to be update.<br \/>\nAnd if I remember correctly, it didn&#8217;t work as it should and I had to add ActionScript. Read my previous decision <a href=\"http:\/\/www.matthijskamstra.nl\/blog\/index.php\/2008\/06\/04\/actionscript-syntax-highlighting\/\">here<\/a>.<br \/>\nSo I had to upgrade to <a href=\"http:\/\/wordpress.org\/extend\/plugins\/syntaxhighlighter\/\">SyntaxHighlighter Evolved<\/a> which of course came with some upgrading issues created by my previous install.<\/p>\n<p>First problem: write ActionScript.<br \/>\nActionScript is not default included in the Syntaxhighter, and you will be advised to use <code>[ javascript ]<\/code> tag, which is a good advice since AS is almost javascript. It would make your live easier if you choose this option.<br \/>\nBut as in my last installment of syntaxhighlighter I want to use Actionscript highlighting.<br \/>\nSo there we go:<br \/>\nTo do that you need an Actionscript brush. I found two of them: <a href=\"http:\/\/www.cptloadtest.com\/CategoryView,category,Flash.aspx\">cptloadtest.com<\/a> has one but it looks like its more for AS2,<br \/>\nand <a href=\"http:\/\/yourpalmark.com\/2009\/02\/17\/as3-syntax-highlighting-with-syntaxhighlighter-20\/\">yourpalmark.com<\/a> which is also the one I choose, because I used his version also with my previous installment and it&#8217;s for AS3.<\/p>\n<p>This is what you need to do: install SyntaxHighlighter and if you choose to use <code>[ javascript ]<\/code><br \/>\nyour done. I was not done yet, so lets continue&#8230; Download <a href=\"http:\/\/yourpalmark.com\/2009\/02\/17\/as3-syntax-highlighting-with-syntaxhighlighter-20\/\">the shBrushAS3.zip<\/a>, extract and place the <code>shBrushAS3.js<\/code> in the correct folder on the server (in my case <code>...\/wp-content\/plugins\/syntaxhighlighter\/syntaxhighlighter\/scripts<\/code>). Now you need to change some code in the WordPress plugin:<br \/>\nYou can do this in WordPress itself if you have writing permission set, or you can edit the php file on your desktop&#8230;<br \/>\nyou need to add the highlighted code <\/p>\n<pre class=\"brush: as3; highlight: [3]; light: true; title: ; notranslate\" title=\"\">\r\n\/\/ Register brush scripts\r\nwp_register_script( 'syntaxhighlighter-core', plugins_url('syntaxhighlighter\/syntaxhighlighter\/scripts\/shCore.js'), array(), $this-&gt;agshver );\r\nwp_register_script( 'syntaxhighlighter-brush-actionscript3', plugins_url('syntaxhighlighter\/syntaxhighlighter\/scripts\/shBrushAS3.js'), array('syntaxhighlighter-core'), $this-&gt;agshver);\r\n<\/pre>\n<p>and <\/p>\n<pre class=\"brush: as3; highlight: [3,4,5,6]; title: ; notranslate\" title=\"\">\r\n\/\/ Create list of brush aliases and map them to their real brushes\r\n$this-&gt;brushes = apply_filters( 'syntaxhighlighter_brushes', array(\r\n\t'as'       =&gt; 'actionscript3',\r\n\t'as2'       =&gt; 'actionscript3',\r\n\t'as3'       =&gt; 'actionscript3',\r\n\t'actionscript'       =&gt; 'actionscript3',\r\n\t'bash'       =&gt; 'bash',\r\n<\/pre>\n<p>and now you are ready to go.<\/p>\n<p>I had to change some other stuff (<code>[ source:as ]...[ \/source ]<\/code> into <code>[ as ]...[ \/as ]<\/code> ) and it seems that my css is not playing nice with syntaxhighlighter. hmmmm this is more work then I thought it would be.<\/p>\n<p>I had to deactivate one plugin: <a href=\"http:\/\/priyadi.net\/archives\/2005\/09\/27\/wordpress-plugin-code-autoescape\/\">autoescape<\/a> , it didn&#8217;t play nice with SyntaxHightlighter. I didn&#8217;t use it anymore, and the combination generated gibberish.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Update #1: hmmmm, stupid but I write these post sometimes weeks ahead&#8230;. and this one caught up on me&#8230; The new version of SyntaxHighlighter Evolved has ActionScript support.. \ud83d\ude42 Update #2: I could remove everything below, but I&#8217;m keeping this here, perhaps someone can use it&#8230;. and it took some time to write, so I [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[22,6,17],"tags":[39,408,155,185,186,406],"class_list":["post-946","post","type-post","status-publish","format-standard","hentry","category-as3","category-open-source-freeware","category-wordpress-plugin","tag-as2","tag-as3","tag-syntax-highlighter","tag-upgrading","tag-wordpress","tag-wordpress-plugin"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/posts\/946","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/comments?post=946"}],"version-history":[{"count":16,"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/posts\/946\/revisions"}],"predecessor-version":[{"id":1018,"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/posts\/946\/revisions\/1018"}],"wp:attachment":[{"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/media?parent=946"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/categories?post=946"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/tags?post=946"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}