Pada awalnya blogger tidak mendukung pembacaan code seperti C++, sehingga saya bingung bagaimana cara memasang C++ di posting di blog serta menampilkan beberapa Bahasa Pemrogaman
lainnya. Pertama kali saya hanya asal menempelkan source code di
posting sehingga bentuknya tidak enak di baca dan malah membuat bingung.
Akhirnya saya ketemu dengan Syntax Highlighter, langsung saya pelajari dan hasil experiment saya ada disini. Tetapi masih menemu kendala..seperti apa yang saya tuliskan di posting Bahasa C++. Oiya sekedar pemberitahuan, ada blogger yang masang script di bawah tag pembuka <head> sedangkan Alex Gorbatchev (Penemu) memasang diatas tag penutup </head>. Lalu yang mana yang akan kita pasang, pengalaman saya ketika di bawah tag <head>.
Source Code tidak terpasang dengan rapi, berparagraf 2 spasi, terpasang
mode zoom. Itu yang terjadi pada blog saya, mungkin di sabahat blogger
lainnya berbeda. Okey Sekarang kita lihat yang ini :
Nah seperti contoh di atas rapi kan.."Blog adalah cermin diri"
Okey kita coba bersama...
1. Masuk ke akun blog anda
2. Rancangan lalu pilih edit HTML
3. Cari kode tag penutup </head>, pakai aja CTRL - F
4. CTRL - A (All Copy) script dibawah ini :
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/> <link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushAS3.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushBash.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushColdFusion.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushDelphi.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushDiff.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushErlang.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushGroovy.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJavaFX.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPlain.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPowerShell.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushScala.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js' type='text/javascript'></script> <script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'></script> <script language="javascript" type="text/javascript"> SyntaxHighlighter.config.bloggerMode = true; SyntaxHighlighter.all(); </script>
5. Paste script tersebut di atas kode tag penutup </head>, jangan lupa expand widget dan membackup template.
6. Simpan. Saya anggap semua script telah tertutup dengan benar.
7. Untuk pemasanngannya saya menggunakan script di bawah ini :
<pre class='brush:js;'>
!--Code Here--!
</pre>
Code yang bisa di tampilakn dalam script diatas adalah :!--Code Here--!
</pre>
- Action Script3
- C++
- Erlang
- JavaFX
- JavaShell
- SQL
- Bash/Shell
- CSS
- Groovy
- Perl
- Phyton
- Visual Basic
- ColdFusion
- Delphi
- JavaScript
- PHP
- Ruby
- Xml, xHtml,xslt, Html
- C#
- Diff
- Java
- Plain Text
- Scala
<pre class='brush:js;'>
<script>
var tit = document.title;
var c = 0;
function writetitle() {
document.title = tit.substring(0,c);
if(c==tit.length)
{
c = 0;
setTimeout("writetitle()", 2000)
}
else {
c++;
setTimeout("writetitle()", 275)
}
}
writetitle()
</script>
</pre>
<script>
var tit = document.title;
var c = 0;
function writetitle() {
document.title = tit.substring(0,c);
if(c==tit.length)
{
c = 0;
setTimeout("writetitle()", 2000)
}
else {
c++;
setTimeout("writetitle()", 275)
}
}
writetitle()
</script>
</pre>
Hasilnya seperti diatas. Selamat mencoba! Saya Bisa, Anda Bisa!!
Read more: http://stzuriah.blogspot.com/2013/03/install-syntax-highlighter-pada-blogger.html