Syntaxhighlighter Evolved: change scripts to CDN

CloudFlare CDNI try to maximise my efforts when it comes to page load times. As such, I’m a big fan and user of CloudFlare because it greatly reduced the loading times of my webpages.

For the Syntaxhighlighter Evolved WordPress plug-in, I wanted to switch the scripts needed to CDNJS, the CloudFlare CDN for scripts and other static sources.

Each time a script is detected by the plug-in, the plug-in adds the necessary scripts to the page as well as the necessary CSS files. However, wasn’t so great for my users, because the number of JavaScript files was quite big.

The solution is the following: edit syntaxhighligher.php in the /wp-content/plugins/syntaxhighlighter folder. Find the following code:


// Register brush scripts
wp_register_script( 'syntaxhighlighter-core', plugins_url( $this->shfolder . '/scripts/shCore.js', __FILE__ ), array(), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-as3', plugins_url( $this->shfolder . '/scripts/shBrushAS3.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-bash', plugins_url( $this->shfolder . '/scripts/shBrushBash.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-coldfusion', plugins_url( $this->shfolder . '/scripts/shBrushColdFusion.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-cpp', plugins_url( $this->shfolder . '/scripts/shBrushCpp.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-csharp', plugins_url( $this->shfolder . '/scripts/shBrushCSharp.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-css', plugins_url( $this->shfolder . '/scripts/shBrushCss.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-delphi', plugins_url( $this->shfolder . '/scripts/shBrushDelphi.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-diff', plugins_url( $this->shfolder . '/scripts/shBrushDiff.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-erlang', plugins_url( $this->shfolder . '/scripts/shBrushErlang.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-groovy', plugins_url( $this->shfolder . '/scripts/shBrushGroovy.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-java', plugins_url( $this->shfolder . '/scripts/shBrushJava.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-javafx', plugins_url( $this->shfolder . '/scripts/shBrushJavaFX.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-jscript', plugins_url( $this->shfolder . '/scripts/shBrushJScript.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-perl', plugins_url( $this->shfolder . '/scripts/shBrushPerl.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-php', plugins_url( $this->shfolder . '/scripts/shBrushPhp.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-plain', plugins_url( $this->shfolder . '/scripts/shBrushPlain.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-powershell', plugins_url( $this->shfolder . '/scripts/shBrushPowerShell.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-python', plugins_url( $this->shfolder . '/scripts/shBrushPython.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-ruby', plugins_url( $this->shfolder . '/scripts/shBrushRuby.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-scala', plugins_url( $this->shfolder . '/scripts/shBrushScala.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-sql', plugins_url( $this->shfolder . '/scripts/shBrushSql.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-vb', plugins_url( $this->shfolder . '/scripts/shBrushVb.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-xml', plugins_url( $this->shfolder . '/scripts/shBrushXml.js', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );

and replace this by the following code:


// Register brush scripts
wp_register_script( 'syntaxhighlighter-core', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shCore.min.js', array(), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-as3', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushAS3.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-bash', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushBash.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-coldfusion', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushColdFusion.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-cpp', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushCpp.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-csharp', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushCSharp.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-css', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushCss.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-delphi', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushDelphi.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-diff', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushDiff.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-erlang', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushErlang.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-groovy', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushGroovy.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-java', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushJava.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-javafx', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushJavaFX.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-jscript', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushJScript.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-perl', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushPerl.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-php', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushPhp.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-plain', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushPlain.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-powershell', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushPowerShell.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-python', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushPython.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-ruby', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushRuby.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-scala', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushScala.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-sql', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushSql.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-vb', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushVb.min.js', array('syntaxhighlighter-core'), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-xml', '//cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushXml.min.js', array('syntaxhighlighter-core'), $this->agshver );

From now on, all of the JavaScript assets needed for this plug-in are loaded from the CloudFlare CDN instead of a local copy!

The same can be applied for the CSS files. Find these files at the Syntaxhighligher page on CDNJS.


// Register some popular third-party brushes
wp_register_script( 'syntaxhighlighter-brush-clojure', plugins_url( 'third-party-brushes/shBrushClojure.js', __FILE__ ), array('syntaxhighlighter-core'), '20090602' );
wp_register_script( 'syntaxhighlighter-brush-fsharp', plugins_url( 'third-party-brushes/shBrushFSharp.js', __FILE__ ), array('syntaxhighlighter-core'), '20091003' );
wp_register_script( 'syntaxhighlighter-brush-latex', plugins_url( 'third-party-brushes/shBrushLatex.js', __FILE__ ), array('syntaxhighlighter-core'), '20090613' );
wp_register_script( 'syntaxhighlighter-brush-matlabkey', plugins_url( 'third-party-brushes/shBrushMatlabKey.js', __FILE__ ), array('syntaxhighlighter-core'), '20091209' );
wp_register_script( 'syntaxhighlighter-brush-objc', plugins_url( 'third-party-brushes/shBrushObjC.js', __FILE__ ), array('syntaxhighlighter-core'), '20091207' );
wp_register_script( 'syntaxhighlighter-brush-r', plugins_url( 'third-party-brushes/shBrushR.js', __FILE__ ), array('syntaxhighlighter-core'), '20100919' );

// Register theme stylesheets
wp_register_style( 'syntaxhighlighter-core', plugins_url( $this->shfolder . '/styles/shCore.css', __FILE__ ), array(), $this->agshver );
wp_register_style( 'syntaxhighlighter-theme-default', plugins_url( $this->shfolder . '/styles/shThemeDefault.css', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_style( 'syntaxhighlighter-theme-django', plugins_url( $this->shfolder . '/styles/shThemeDjango.css', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_style( 'syntaxhighlighter-theme-eclipse', plugins_url( $this->shfolder . '/styles/shThemeEclipse.css', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_style( 'syntaxhighlighter-theme-emacs', plugins_url( $this->shfolder . '/styles/shThemeEmacs.css', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_style( 'syntaxhighlighter-theme-fadetogrey', plugins_url( $this->shfolder . '/styles/shThemeFadeToGrey.css', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_style( 'syntaxhighlighter-theme-midnight', plugins_url( $this->shfolder . '/styles/shThemeMidnight.css', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );
wp_register_style( 'syntaxhighlighter-theme-rdark', plugins_url( $this->shfolder . '/styles/shThemeRDark.css', __FILE__ ), array('syntaxhighlighter-core'), $this->agshver );

 

Author Bio

Thank you for your interest in my blog! On this miniblog, I write mostly short (technical) blog posts that might interest other people. Read more about me or feel free to contact me.

 

Leave a Reply

Your email address will not be published. Required fields are marked *