Cara Memasang Syntax Highlighter di Blogspot

source code dapat di copy dengan mengarahkan cursor ke area source code kemudian mengklik tombol dengan icon kertas putih dan <>
Syntax Highlighter adalah sebuah cara lain untuk menampilkan suatu source code atau sintax pada sebuah website atau blog. Syntax highlighter digunakan oleh blogger agar sebuah syntax yang disharing dalam suatu postingan website atau blog agar terlihat menjadi lebih menarik. Penggunaannya dapat kita manfaatkan pada source code Bahasa pemrograman apapun termasuk PHP, Java, Delphi atau Pascal, Perl, Python dan lain sebagainya. Berikut saya akan berbagi sedikit trik bagaimana cara memasang syntax highlighter di blogspot. adapun hasil yang kita inginkan adalah seperti gambar berikut

Cara Memasang Syntax Highlighter di Blogspot

Langkah Memasang Syntax Highlighter di Blogspot

1. Masuk ke Dashboard Blog | Template | Edit HTML

2. Cari Code ]]></b:skin> (sebaiknya gunakan CTRL+F). Jika sudah ketemu silahkan copy dan paste code berikut tepat dibawahnya (code dibawah menggunakan syntax highlighter) lalu Simpan Template anda.
<link href='http://alexgorbatchev.com/pub/sh/2.1.382/styles/shCore.css' rel='stylesheet' type='text/css'/> 
<link href='http://alexgorbatchev.com/pub/sh/2.1.382/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/> 
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shCore.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCpp.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCSharp.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCss.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shYouBrushJava.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushJScript.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPhp.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPython.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushRuby.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushSql.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushVb.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushXml.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPerl.js' type='text/javascript'/> 
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushDelphi.js' type='text/javascript'/> 
<script language='javascript'> 
SyntaxHighlighter.config.bloggerMode = true; 
SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/2.1.382/scripts/clipboard.swf'; 
SyntaxHighlighter.all(); 
</script> 
3. Langkah terakhir adalah penggunaanya. Caranya letakan syntax atau source code anda tepat sebelum tag </pre> pada code berikut
<pre class="brush:jfx, brush:javafx, brush:java, brush:php, brush:css, brush:js, brush:html, brush:sql"> // Source Code Anda Disini </pre>

4. Anda perlu melakukan parse code terlebih dahulu pada source code bahasa pemrograman berbasis website seperti PHP, ASP dan HTML sebelum meletakan code anda disana.

5. Anda perlu menambahkan, mengganti atau mengurangi code brush:jenis_syntax pada step 3 diatas sesuai dengan jenis source code atau script anda.

6. Pada saat anda menggunakan syntax highlighter tersebut anda perlu mengganti mode editor pada blog dengan HTML (bukan Compose) agar syntax highlighter dapat bekerja dengan baik. 
source code dapat di copy dengan mengarahkan cursor ke area source code kemudian mengklik tombol dengan icon kertas putih dan <>

Share this

Related Posts

Previous
Next Post »

bantu kami untuk lebih baik; jika ada hal yang kurang jelas atau broken link silahkan masukan komentar anda kami akan segera menanggapi dan memperbaikinya. login ke akun gmail anda untuk menampilkan form komentar.