Studi Kasus : Menggunakan plugin SyntaxHighlighter untuk menulis kode program dalam postingan WordPress
Requirements : WordPress bundle, download here. and SyntaxHighlighter, download here.
Adakalanya kita akan membutuhkan untuk menulis kode program (sourcecode) dalam postingan di WordPress kita. Hal ini misalkan ketika kita menulis suatu tutorial untuk bahasa pemrograman tertentu. WordPress sendiri sebenarnya telah menyediakan fasilitas untuk menuliskan kode program seperti ini yaitu dengan menggunakan syntax,
<code> your code here </code>
Sebenarnya fasilitas tersebut dapat berjalan dengan baik dalam menampilkan kode anda, namun mungkin anda tidak akan begitu menyukainya karena tampilannya yang… tidak begitu bagus. Kecil kecil, dan berwarna sama untuk semua kode. Seperti ini,
Kalau anda memang tidak menyukai hal tersebut, mungkin anda harus mencoba plugin WordPress satu ini. Syntax Highlighter. Menulis kode program menggunakan plugin ini akan memberi keuntungan diantaranya,
- Terdapat penomoran didepan setiap baris code –> Hal ini memudahkan apabila anda ingin memberi penjalasan terhadap kode tersebut.
- Berwarna-warni –> Jadi akan lebih jelas bagian kodenya, mana yang merupakan variabel, mana yang komentar, dll
- Ukuran font standar –> Enak dibaca. Tidak terlihat njlimet seperti kode program biasanya π
- Bisa dikustomisasi (diatur sendiri) dengan banyak pilihan opsional. Misal, code bisa diberi highlight.
Step 1 : Instalasi Syntax Highlighter
- Download plugin syntaxhighlighter dari sini
- Mulai instalasi. Login ke halaman wordpress anda, maka anda akan diarahkan ke halaman dashboard
- Pilih menu Plugins pada samping kiri halaman WordPress anda.
- Pilih tab Add New
- Pada menu Install Plugin, pilih tab Upload.
- Browse file zip syntaxhighlighter plugin hasil download, kemudian klik Install Now
- Maka akan ditampilkan konfirmasi sukses instal seperti gambar dibawah.
- Klik Activate Plugin untuk langsung mengaktifkan plugin tersebut.
Step 2 : Penggunaan Plugin
- Lakukan posting baru dengan memilih menu Posts – Add New
- Ketikkan contoh berikut ini pada halaman HTML editor (bukan halaman Visual Editor). Lihat gambar dilingkari merah,
- Sesimple itu saja. Pilih publish dan anda akan melihat tampilan seperti berikut,
Untul lebih lengkapnya plugin ini mendukung bahasa pemrograman mulai dari actionscript3, bash, coldfusion, cpp, csharp, php, css, xml, javascript, java, perl, sql.. hingga phyton π untuk lebih lengkapnya plugin ini mendukung bahasa apa saja lihat disini.
Step 3 : Kustomisasi Plugin
Dengan plugin ini, anda juga bisa mens-kustomisasi tampilan source code dengan berbagai pilihan opsional. Salah satu pilihan opsional adalah anda bisa memberi highlight pada baris tertentu pada code. Contoh,
Hasil –>
Dan masih banyak pilihan opsional yang bisa anda coba sendiri. Anda bisa mengetahui berbagai pilihan opsional tersebut di sini.
Selamat mencoba π happy WordPress-ing π
16 replies on “Posting Source Code dalam WordPress MUDAH dengan SyntaxHighlighter”
First off I want to say awesome blog! I had a quick question that I’d like to ask if you do not mind.
I was curious to know how you center yourself and clear your
head prior to writing. I’ve had trouble clearing my
mind in getting my thoughts out. I truly do take pleasure in writing however it just seems
like the first 10 to 15 minutes are usually wasted simply just trying to
figure out how to begin. Any recommendations or tips?
Kudos!
gan saya butuh bantuan utk men check sourde code atau web asli nya..mudah2an agan bisa bantu
Untuk wordpress free bisa pakai trik disini om https://nubiprogrammer.wordpress.com/2017/02/01/memasukkan-syntax-code-ke-postingan-wordpress-gratis/
In my opinion, I prefer Kirsten Stewart. She looks like the kind of girl that you can have a good time with and laugh with, and she is sexy without even trying, in my opinion. I only notice looks with the other three girls, but I think of more with Stewart. (Her being in the Twilight Saga is part of the reason, but not all of it.)
pusing otak atik wordpress, bnyk bgt sourcecode yg kudu diplajari
One thing I’d prefer to comemnt on is that weightloss system fast can be carried out by the suitable diet and exercise. People’s size not only affects appearance, but also the general quality of life. Self-esteem, melancholy, health risks, and also physical capabilities are damaged in putting on weight. It is possible to make everything right and at the same time having a gain. Should this happen, a problem may be the offender. While an excessive amount of food rather than enough exercising are usually at fault, common health conditions and popular prescriptions may greatly add to size. Thanks for your post right here.
Gan kalau masih .wordpress itu tarusnya dimana ya? hehee alias masih blog gratisan
makasih infonya, akhirnya nemu juga. ke tkp dulu π
artikel sangat membantu..terima kasih..!
terima kasih infonya, sangat membantu sya sekali sebagai newbie.. π
alhamdulillah nemu pencerahan juga π
kalog wordpress yg gratis bisa ga ya?
wordpress khn emang gratis (thinking)
Kebetulan saya juga mau pasang plugin ini, tapi masih agak bingung. π Setelah baca artikel ini saya sedikit banyak tau tentang SyntaxHighlighter. π
[…] click here for detail […]
ini seharusnya jadi fitur standar wordpress, membantu memudahkan membaca kode yang ditampilkan di blog.