Membuat Syntax Highlight Keren

Pa kabar sobat, salam senyum untuk semuanya. Ini nih sobat ane mau postingin tentang pemasangan Syntax Highlight, yaitu suatu tag yang digunakan untuk mempermudah dalam memberikan informasi syntax-syntax, seperti Html, Css, xml, PHP, dan syntax program lainya.

Memang agak berbeda sedikit ame yang ada di blog ane, klo di tempat ane backgroundya putih, mungkin sobat bisa melihat langsung pada blog ane. Nah yang ane postingin seperti pada gambar, gimana.....
Ok Biar ga penasaran yuk ikuti step by stepnya......

1. Login ke akun blog sobat
2. Pilih Rancangan, edit html
3. Cari kode </head>
4. Masukan Scrip dibawah ini, diatas kode no.3
   

   
   
   <!-- 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 -->
   
   

   
   


5. Sekarang Simpan deh, klik save
   
   Nah itu belum siap, untuk menggunakanya seperti ini :
   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 Mudahkan, Semoga bermanfa'at....
   

Salam senyum, untuk semua....

---

Source: http://dj-note.blogspot.com/2011/02/cara-membuat-syntax-highlighter-ala.html

Salam senyum dariku untuk semuanya, tetaplah untuk bersemangat. Jangan lupa Comment atau isi buku tamu ya sob. Sedikit pemberitahuan untuk sobat yang ingin mengambil [Copy-Paste], Owner tidak melarang sobat untuk memperbanyak artikel namun Owner berharap sobat berlaku dengan bijak agar mencantumkan link active maupun yang tidak. Owner berharap partisipasinya ya sob.

---

---