Cara Mudah Membuat Syntax Highlighter Di Blogspot

( img : Syntax Highlighter )

Untuk sobat blogger yang ingin membuat Syntax Highlighter di blog , simak langkah - langkahnya dibawah ini :
  • Log in di blog anda
  • Klik rancangan => Edit HTML
  • Cari kode </head>
  • Copy kode css dibawah ini dan Paste di atas kode </head>
<!-- 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 -->
  • Save template

Untuk menulis di postingan, gunakan kode seperti dibawah ini
  • Untuk Kode CSS :
<pre class="brush: css">
LETAKKAN KODE CSS DI SINI
</pre>
  • Untuk Kode HTML :
<pre class="brush: html">
LETAKKAN KODE HTML DI SINI
</pre>
  • Untuk Kode JAVASRIPT :
<pre class="brush: JS">
LETAKKAN KODE JavaScript DI SINI
</pre>

Dan jangan lupa, postingan juga harus di mode Edit HTML bukan mode COMPOSE

Anda baru saja membaca artikel yang berkategori Blogger / Desain Blog dengan judul Cara Mudah Membuat Syntax Highlighter Di Blogspot . Anda bisa bookmark halaman ini dengan URL http://klikdul.blogspot.com/2012/08/cara-mudah-membuat-syntax-highlighter.html . Terima kasih!
Ditulis oleh: ortega -

7 komentar untuk " Cara Mudah Membuat Syntax Highlighter Di Blogspot "

  1. ea... gagal gan!! terpaksa nyari tutorial yang laen..

    tapi blog agan mantap deh hahaha...
    di tungu kunjungan baliknya http://rahmatdi99.com atau http://rahmatdi99.blogspot.com

    BalasHapus
  2. ada yang lebih baru gan, di cek d blog ane...

    BalasHapus
  3. Terima kasih, postingannya sangat membantu..

    BalasHapus
  4. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  5. Disini Guys : http://lovekarawang.blogspot.co.id/2017/06/cara-membuat-kotak-script-highlighter.html?showComment=1502949431131#c4217266514441549186

    BalasHapus