Kebanyakan blogger menggunakan blockquote standar untuk berbagi tutorial skrip dan kode dengan pengunjung mereka, namun
Alex Gorbatchev telah menciptakan sebuah Highlighter yang berfungsi penuh untuk membuat script dan kode tampak lebih rapi dengan menampilkannya dalam gaya teknologi web seperti HTML, CSS, JavaScript, Php, Python, Sql, xml dll. Dengan Syntax Highlighter Kode ditampilkan baris demi baris dengan nomor baris dan kelompok class kode juga tersedia untuk pengguna dengan pilihan Cetak kode, salin ke klip papan atau untuk melihat Source code.
Cara Menambahkan Sintaks Highlighter Di Blogger?Langkahnya sederhana dari apa yang Anda bayangkan Ikuti langkah-langkah dibawah ini,
1. Buka akun Blogger> Pilih Template> Edit HTML
2. Backup template Anda untuk menjaga terjadinya kesalahan
3. Lalu cari kode tag seperti ini,
]]></b:skin> atau </style>
4. Dan tepat di bawahnya paste kode berikut,
<!--SYNTAX HIGHLIGHTER BY DB STARTS-->
<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 language='javascript'>
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/2.1.382/scripts/clipboard.swf';
SyntaxHighlighter.all();
</script>
<!--SYNTAX HIGHLIGHTER BY DB ENDS-->
5. Simpan perubahan yang telah anda buat
Bagaimana menempatkannya di dalam posting?Setiap kali Anda ingin berbagi kode dari jenis apa pun dengan pembaca Anda, cukup letakkan kode di antara kode berikut,
<pre class="brush:css, brush:html, brush:js, brush:php, brush:sql, brush:python">
Tulis kode disini
</pre>
Catatan: Jangan menambahkan kode secara langsung karena Anda akan mendapatkan error di Blogger Editor, silahkan mengurai kode menggunakan Parser terlebih dahulu.
Ganti
Tulis kode disini dengan kode yang telah diurai/dikodekan dengan parse dan publikasikan posting anda lalu lihat hasilnya.
Selamat mencoba sob...
Belum ada tanggapan untuk "Cara Memasang Sintaks Highlighter untuk blogger"
Post a Comment