Home disini
widget by sy@ms

Latest Posts

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.



2 komentar:

Andikwin Trenggalek Jawa Timur mengatakan...

trima kasih gan sudah mau bebagi!mantap hasillnya

sy@ms mengatakan...

Sebelumnya salam kenal sob.
Trims ya dah mampir, semoga artikelnya dapat bermanfaat.

26 Juli 2012 10.40

Jam Sekarang
Tanggal
Salam Sapa :
Status Blogging :

*ket. status : Terjadwal : Berarti yang punya blog tidak bisa berinternet [ More... ]





sy@ms
skyNET program


Join the conversation for skyNET program

 
 free web counter Counter Powered by  RedCounter

© 2011 || Copyright by sy@ms || Thanks for skyNET program All Reserved

Technology Blogs TopOfBlogs Top Blogs Internet Internet Blogs Phil Backlink Display Pagerank
Yahoo bot last visit powered by MyPagerank.Net
USA Backlinks Free Backlinks Service at USABacklinks.com! Auto Backlink Gratis Indonesia : Top Link Indo My Ping in TotalPing.com ping fast  my blog, website, or RSS feed for Free