Cara Membuat Syntax High Lighter

Kali ini saya ingin mengajak anda untuk membuat Syntax Highlighter, Apa Itu Syntax Highlighter? Syntax Highlighter bisa dibilang punya fungsi yang hampir sama dengan "Blockquote" namun bedanya Syntax Highlighter lebih dikhususkan untuk syntax HTML, CSS ataupun Javascript. Bentuk dari Syntax Highlighter pun dibuat menyerupai page Code di Aplikasi seperti Jcreator atau lainnya yang pastinya sudah sangat Familiar untuk anda yang berkecimpung di dunia Programing. untuk yang masih bingung dan gak ada bayangan tentang bentuk dari Syntax Highlighter ini,
silahkan liat gambar diatas atau silahkan liat penggunaannya yang saya contohkan dipostingan kali ini. Lantas siapa yang Men-Develop Syntax Highlighter ini? Developernya adalah Alex Gorbatchev yang dari tahun 2004 hingga kini masih terus mengembangkan Syntax Highlighter ini. Dan jika berminat anda bisa ikut memberikan Donasi anda untuk pengembangannya... Lihat Contohnya disini

Lalu bagaimana Cara membuatnya?

1. Login ke Blogger anda masing-masing

2. Klik Design / Rancangan, kemudian pilih edit html

3. Centang Expand Widget Template

4. Cari kode seperti ini </head>

5. Jika sudah ketemu, letakkan Kode dibawah ini tepat diatas atau sebelum kode tersebut::

<!-- Add-in CSS for syntax highlighting --><link href='http://alexgorbatchev.com/pub/sh/2.1.364/styles/shCore.css' rel='stylesheet' type='text/css'/><link href='http://alexgorbatchev.com/pub/sh/2.1.364/styles/shThemeRDark.css' rel='stylesheet' type='text/css'/><<!-- Add-in Script for syntax highlighting --><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shCore.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushAS3.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushBash.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushCSharp.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushColdFusion.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushCpp.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushCss.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushDiff.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushErlang.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushGroovy.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushJScript.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushJava.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushJavaFX.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushPerl.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushPhp.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushPlain.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushPowerShell.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushPython.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushRuby.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushScala.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushSql.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushVb.js' type='text/javascript'></script><script src='http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushXml.js' type='text/javascript'></script><script language='javascript'>SyntaxHighlighter.config.bloggerMode = true;SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/2.1.364/scripts/clipboard.swf';SyntaxHighlighter.all();</script><!-- End code hilight -->

6. Jika sudah, Save Template anda.

Dan berikut cara penggunaanya di postingan:

Untuk Kode CSS:

<pre class="brush: css">Letakkan Kode CSS Disini</pre>

Untuk Kode HTML:

<pre class="brush: html">Letakkan Kode HTML Disini</pre>

Untuk Kode Javascript:

<pre class="brush: Java">Letakkan Kode Javascript Disini</pre>

Gimana gampang kan, cuma tinggal masukkin Javascriptnya saja.

<<SEBELUMNYA                                                                              DAFTAR ISI                                                                             BERIKUTNYA>>