Momijikun Blog: Kini lebih mudah dengan SyntaxHighlighter

Untuk post kedua, aku nak info sikit pasal SyntaxHighlighter.

Apakah itu SyntaxHighlighter?
- Function yang di gunakan untuk menampakkan coding2 supaya lebih cantik dan teratur serta lebih mudah untuk developer2 yang lain bagi memudahkan "copy paste" coding yang korang share. dan SyntaxHighlighter di bangunkan sepenuhnya mengunakan Javascript.

Mengunakan SyntaxHighlighter :

$test = "Ini lah kelebihan SyntaxHighlighter";
echo $test;

Tanpa SyntaxHighlighter:
$test = "Ini tanpa SyntaxHighlighter";
echo $test;

Cantik bukan? Nampak lebih teratur dan kemas.

So, berikut adalah step by step untuk setting korang punya SyntaxHighlighter.

Step 1: Copy semua javascript di bawah letak di antara <head></head>

<link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css" rel="stylesheet" type="text/css"></link> 
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js" type="text/javascript"></script> 
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js" type="text/javascript"></script> 
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js" type="text/javascript"></script> 
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js" type="text/javascript"></script> 
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js" type="text/javascript"></script> 
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js" type="text/javascript"></script>
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js" type="text/javascript"></script>
<script language="javascript">
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf';
SyntaxHighlighter.all();
</script>

Step 2: Ada 2 cara untuk mengunakan SyntaxHighlighter

Mengunakan pre tag

<pre class="brush: php">
$preTag = "Mengunakan Pre Tag";
<pre>

Mengunakan Script tag

<script type="syntaxhighlighter" class="brush: php">
$scriptTag = "Mengunakan script Tag";
</script>

Mudah kan? Jika korang mengunakan code yang menpunyai simbol < dan > . Seharusnya di encode terlebih dahulu sebelum korang letak code ke dalam SyntaxHighlighter . Kalau korang x tau html encode bleh lah layari website ni HTML ENCODER. Masukan jak code korang pastu tekan encode.

Selamat mencuba :)
p/s : Tujuan aku post SyntaxHighlighter ni supaya nnt bleh share coding dlm bog ni.. hehehe

Photo slider

Thursday, 7 March 2013

Kini lebih mudah dengan SyntaxHighlighter

No comments:

Post a Comment