SyntaxHighlighter 3.0.83 usage notes

1. Download

SyntaxHighlighter 3.0.83: http://alexgorbatchev.com/SyntaxHighlighter

2. Configuration

(1) The default label for SyntaxHighlighter parsing is pre

The code copy is as follows:

SyntaxHighlighter.config.tagName="div";

(2) Remove HTML line break tags

If your software adds < br /> tags at the end of each line, this option allows you to ignore these tags.

The implementation code in shCore.js is:

The code copy is as follows:

if (sh.config.stripBrs == true)

str = str.replace(br, '');

SyntaxHighlighter.config.stripBrs=true;

(3) The toolbar is not displayed

The code copy is as follows:

SyntaxHighlighter.defaults['toolbar'] = false;

3. Use in the code

3.1 brush is a required option, and the rest are optional:

The code copy is as follows:

<div>some java code</div>

Brush value: java/xml/sql/c/js/css, etc., see: http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/

3.2 Shading call:

The code copy is as follows:

SyntaxHighlighter.highlight();

or

The code copy is as follows:

SyntaxHighlighter.all();

The difference between all() and highlight() is that all() is registered in the onload() event.

4. Use in the blog park

Blog Park supports SyntaxHighlighter by default. The code changes the default value (because jQuery does not support setting the !important style, so cssText needs to be set):

The code copy is as follows:

var sh = $(".syntaxhighlighter");

var code = sh.find("code");

var line = sh.find(".line");

var caption = sh.find("table caption");

sh.css("cssText", "width: auto !important");

code.add(line)

.add(caption)

.css("cssText", "font-size: 20px !important;white-space: nowrap !important;line-height: 1.5em !important;");

The above is all about this article. Have you gained a new understanding of how to use SyntaxHighlighter? I hope you can like this article.