File Online: Menampilkan Postingan Source Code di Blogspot dan Wordpress

Wednesday, February 15, 2017

Menampilkan Postingan Source Code di Blogspot dan Wordpress

ketoprakdjawir.- Bagi seorang programmer, sangatlah penting bagi kita untuk memposting suatu source code dengan penulisan yang benar dan menggunakan format yang sesuai. Acap kali saat kita mulai menempelkan source code pada postingan kita, yang terjadi adalah tulisan yang amburadul dan tidak mengikuti aturan penulisan. Inilah masalah yang baru-baru ini saya alami saat ingin memposting suatu source code di blog. Setelah tanya sana tanya sini, baik melalui teman ataupun mbah Google, akhirnya saya dapat pencerahan juga. Disini saya hanya akan memberikan trik memposting/menampilkan source code di Wordpress dan Blogspot.

Wordpress
Dari pihak wordpress, sangatlah mudah bagi kita untuk menempelkan suatu source code. Wordpress telah menyediakan tag khusus untuk menampilkan suatu source code Kita hanya tinggal menambah sedikit tag khusus pada "Edit HTML"-nya pada saat menulis postingan, yaitu :
```
[source code language="java"]
 
/*masukkan source code di sini*/
 
[/source code]
```
Mudah bukan ?? Untuk mengganti format bahasa nya, kita tinggal merubah di antara tanda kutip setelah language= dengan bahasa yang diinginkan. Bahasa yang sudah di-support oleh Wordpress adalah :
- actionscript3bash
- coldfusion
- cpp
- csharp
- css
- delphi
- erlang
- fsharp
- diff
- groovy
- javascript
- java
- javafx
- matlab (keywords only)
- objc
- perl
- php
- text
- powershell
- python
- ruby
- scala
- sql
- vb
- xml
Blogspot
Nah, untuk yang satu ini, ternyata dari pihak Blogspot tidak mendukung pemasangan source code pada postingan. Dimana kita tidak akan menemukan suatu tag khusus sebagai pendukung penulisan bahasa pemrograman yang baik dan benar seperti yang ada pada Wordpress (sempat saya berfikir untuk hijrah dari Blogspot ke Wordpress gara2 masalah ini). Tapi untung saja, saya menemukan cara unik yang menurut saya sangat briliant dan benar-benar akan membantu saya untuk kedepannya dalam membuat postingan yang bermutu :D (Amin, hehehe). Jurus ampuh itu adalah 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. Oke, langsung saja kita akan memulai langkah-langkah penggunaannya :
- Karena kita akan memodifikasi suatu template di Blogspot, maka alangkah baiknya kita mem-backup dulu Layout sebelumnya. Caranya, buka Dashboard-Design-Edit HTML-Download Full Template. Kemudian simpan file download di komputer.
- Setelah itu, masih dalam Dashboard-Design-Edit HTML, tekan "Control-F" untuk mencari tag penutup </head> Kemudian copy-paste source code di bawah ini, sebelum/diatas tag tersebut :
```
 
 
 
 
 
 
 
 
 
 
 
 
 
```
- Simpan perubahan template. Jika tidak ada error, maka integrasi template telah berhasil
- Saat ingin menempelkan suatu source code, kita hanya tinggal mengedit nya di Edit HTML pada Editor, dengan menyisipkannya diantara tag berikut :
```
/*masukkan source code di sini*/
```
- Untuk format bahasanya, ada beberapa bahasa yang didukung SyntaxHighlighter:
  - C++ (cpp, c, c++)
  - C# (c#, c-sharp, csharp)
  - CSS (css)
  - Delphi (delphi, pascal)
  - Java (java)
  - Java Script (js, jscript, javascript)
  - PHP (php)
  - Python (py, python)
  - Ruby (rb, ruby, rails, ror)
  - Sql (sql)
  - VB (vb, vb.net)
  - XML/HTML (xml, html, xhtml, xslt).

Article Copas From : http://timordotx.blogspot.com/2010/10/test_10.html

Available link for download