Sabtu, 30 Maret 2013
Saya seringkali butuh menuliskan kode program (source code) pada coretan-coretan saya di blog ini. Sebenarnya banyak tutorialnya sih di internet, cuma saya juga ingin menuliskannya di sini biar nantinya saya nggak bingung nyari-nyari lagi, hehe.
Coretan ini repost dari blog hasil googlingan saya untuk mencari cara posting source code mengenai Cara Menampilkan/Memposting Source Code di Wordpress dan Blogspot. Alangkah bagusnya jikalau kita melihat tampilan source code seperti di Notepad++. Langkah-langkahnya begini nih:
- Wordpress
- Hal yang seperti di atas tidak berlaku di blogspot, karena pihak blogspot tidak mendukung pemasangan sourcecode dalam postingan. tetapi jangan khawatir, kita bisa memanfaat coding javascript yang bernama SyntaxHighlighter. Syntax Highlighter adalah suatu java script yang dibuat adalah Alex Gorbatchev dan berupa open source, sehingga kita dapat mendowload source code-nya dan memodifikasi sesuai keinginan kita. Berikut langkah-langkahnya :
Untuk Wordpress, kita tidak perlu susah-susah karena Wordpress sudah menyediakan plugin tambahan untuk pembuatan source codenya. Kita hanya perlu menambahkan tag [source code language="java"][/source code] pada saat kita akan mempostingkan sebuah soure code. Contohnya sepert berikut ini :
[source code language="java"]
public class HayAct extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
} [/source code]
kita bisa mengganti format bahasanya dengan merubah languagenya yaitu yang diapit dengan dua tanda kutip sesuai dengan yg kita inginkan.
- kita buka akun blogger kita, kemudian pilih Dashboard-Design-Edit HTML, sebelumnya kita lakukan backup dulu templatenya agar jika terjadi sesuatu yg tidak diinginkan dapat kita kembalikan seperti semula.
- Kemudian Edit HTML tekan tombol Ctrl-F dan letakkan source code di bawah ini di atas tag </head>
<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/shBrushCpp.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/shBrushCss.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/shBrushJScript.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/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/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 src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js" type="text/javascript"></script> <script language="javascript"> SyntaxHighlighter.config.bloggerMode = true; SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf'; SyntaxHighlighter.all(); </script>
<pre class="brush: java"> /*ketikkan source code di sini*/ </pre>
