Beranda > Lain-lain, Tips 'n Tricks > Tips Menulis Artikel Pemrograman di WordPress

Tips Menulis Artikel Pemrograman di WordPress

a-java-source-codeBeberapa waktu yang lalu, saya penasaran dengan beberapa blog di wordpress.com yang menampilkan source code dengan cantiknya, lengkap dengan syntax highlighting dan indentasi yang rapi. Berhubung waktu itu saya tidak tahu bagaimana caranya, dan belum mencari tahu, maka artikel yang saya terbitkan dan mengandung kode program cuma saya apit dengan blockquote (Blok kutipan). Tentunya ini tidak menjadi the right tool for the job.

Ternyata, setelah dicari via googling, rahasianya hanya ada pada penggunaan kode [sourcecode] pada bagian di mana kita ingin menampilkan source code yang ingin kita bagi dengan dunia, ditambah dengan atribut language=””. Sebagai contoh, jika kita ingin menampilkan penggalan kode HTML dasar sebaga source code untuk mengajarkan pemrograman via artikel di wordpress, kita dapat menggunakan kode sebagai berikut:

[sourcecode language=’html’]
<table>
<tr><td>ini tabel dengan satu cell</td>
</table>
[/sourcecode]

Dari kode tersebut yang kita ketikkan apa adanya saat membuat artikel, akan dihasilkan tampilan berikut ini :


<table>
<tr><td>ini tabel dengan satu cell</td></tr>
</table>

Sedangkan nilai yang bisa digunakan untuk atribut language=”” di antaranya :

  • as, as3
  • cpp, c, c++
  • c#, c-sharp, csharp
  • cf, coldfusion
  • css
  • delphi, pascal
  • diff
  • erlang
  • groovy
  • java
  • javafx
  • js, jscript, javascript
  • perl
  • php
  • plain
  • powershell
  • py, python
  • rb, ruby, rails, ror
  • scala
  • sql
  • vb, vb.net
  • xml, html, xhtml, xslt

Untuk memanfaatkannya di blog gratisan dengan domain wordpress.com, kita bisa langsung menggunakannya tanpa ada prosedur khusus karena plugin untuk keperluan ini sudah terinstall secara default. Namun agar bisa memanfaatkannya pada blog di server kita yang terinstall aplikasi dari wordpress.org, kita membutuhkan plugin bernama SyntaxHighlighter2 untuk diinstall terlebih dahulu.

Oleh penyusun plugin tersebut, diberikan juga alternatif untuk mengganti kode [sourcecode language='css']kode anda[/sourcecode] jika dirasa terlalu panjang, dapat diganti dengan alternatif sebagai berikut :

  • [source language='css']code here[/source]
  • [code language='css']code here[/code]
  • [sourcecode lang='css']code here[/sourcecode]
  • [source lang='css']code here[/source]
  • [code lang='css']code here[/code]
  • [sourcecode='css']code here[/sourcecode]
  • [source='css']code here[/source]
  • [code='css']code here[/code]

Referensi lebih lanjut :

  1. http://en.support.wordpress.com/code/posting-source-code/
  2. http://mohanjith.com/2009/03/syntaxhighlighter2.html

Comments

comments

  1. Debby
    14/06/2010 pada 11:20 | #1
    via Mozilla Firefox Mozilla Firefox 3.0.7 pada Windows Windows XP

    Pak lebih ditambahi lagi artikelnya..biar kita anak RPL tahu seberapa luas dunia coders

  2. 14/06/2010 pada 11:49 | #2
    via Mozilla Firefox Mozilla Firefox 3.6.3 pada Windows Windows XP

    ya, sabar bentar. Ini masih banyak tanggungan mengurusi PMDK. Sambil nunggu kontributor/penulis yang lain.

  3. 22/06/2010 pada 5:05 | #3
    via Mozilla Firefox Mozilla Firefox 3.6.3 pada Windows Windows XP

    webnya keren bos. boleh join nyumbang artikel?

  4. 22/06/2010 pada 10:29 | #4
    via Mozilla Firefox Mozilla Firefox 3.6.3 pada Windows Windows XP

    @salmane
    Silakan Pak Slamet, malahan sangat dianjurkan. Daftar dulu, trus ntar saya naikkan privileges-nya.

  5. Aris
    12/01/2011 pada 9:05 | #5
    via Internet Explorer Internet Explorer 8.0 pada Windows Windows 7

    Pak Hendri,,
    mohon Artikel Nya Di tambah Lagi..

  6. 04/11/2011 pada 18:56 | #6
    via Opera Mini/Mobile Opera Mini/Mobile 4.2.14881

    Pak hendri , saya boleh nymbng artikel tentang cra membuat website di web hosting menggunakan coding php pak

  7. 21/02/2012 pada 9:04 | #7
    via Mozilla Firefox Mozilla Firefox 10.0.2 pada Windows Windows XP

    Boleh, tapi setiap artikel yang masuk dari kontributor akan kami review terlebih dahulu sebelum di-publish.

  1. Belum ada tautan balik

%d blogger menyukai ini: