Tuesday, 5 February 2013

Blogging Tutorial - Membuat Code Snippet untuk Blogspot

Advertisement

Sebagai seseorang yang bakal sering menulis codingan di blogspot-nya, tentunya lebih bagus dan efisien tidak menggunakan gambar untuk efisiensi ruangan memory. Dengan diketik langsung juga tampaknya kurang bagus. Solusinya adalah dengan menggunakan code-snippet. Kali ini saya akan share bagaimana menulis code-snippet pada blogspot.





Ada banyak cara, salah satunya adalah dengan menggunakan fitur yang tersedia di web ini. Tinggal copy-paste saja kodingannya, klik tombol Format Source Code, dan hasilnya adalah seperti di bawah ini.

 #include<stdio.h>  
int main(void)
{
printf("Hello World");
}

Cara kedua adalah dengan menggunakan Javascript.
- Copy-paste script ini dan temapatkan pada html template blogspot kalian. Letaknya sebelum tag </head>. Simpanlah hasil editannya sesudah memastikan semua blognya tidak menjadi aneh leewat Pratinjau.
<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 src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'>













- Gunakanlah tag <pre> untuk membuat suatu code-snippet yang diketikkan pada HTML editor blogspot. Contohnya seperti ini:

 <pre class="brush: csharp">// Comment  
public class Testing {
public Testing() {
}
public void Method() {
/* Another Comment
on multiple lines */
int x = 9;
}
}
</pre>

Hasilnya akan seperti ini:

// Comment
public class Testing {
public Testing() {
}

public void Method() {
/* Another Comment
on multiple lines */
int x = 9;
}
}

Bagus + keren kan? Untuk metode kedua, saya belajar dari sini. Selamat mencoba. ; )



EmoticonEmoticon

:)
:(
hihi
:-)
:D
=D
:-d
;(
;-(
@-)
:o
:>)
(o)
:p
:-?
(p)
:-s
8-)
:-t
:-b
b-(
(y)
x-)
(h)