Selamat Datang

10 Syntax Highlighter Terbaik Untuk Menulis Kode di Halaman Website

Terkadang kita perlu untuk menulis potongan kode program di dalam website yang sedang kita buat agar dapat dibaca oleh orang lain. Hal ini biasa nya perlu dilakukan oleh sebuah website yang kontennya berupa tutorial pembuatan program atau website.

Hal diatas juga terjadi pada website tutorial-webdesign.com yang sedang anda baca ini, dimana kami juga perlu untuk menampilkan potongan-potongan kode program dari tutorial yang kami jelaskan. Anda bisa membaca bagaimana cara kami menampilkan potongan kode program pada artikel Migrasi dari SyntaxHighlighter, disitu bisa anda ketahui plugin apa yang digunakan di website TWD.

Ada banyak sekali jquery plugin yang bisa anda gunakan untuk menampilkan potongan kode, dengan plugin sintax highlighter potongan program yang ditulis akan terlihat rapih, akan menyesuaikan dengan lebar layout anda, dan tidak akan di eksekusi oleh website itu sendiri.

Berikut kami informasikan kepada anda 10 jQuery syntax highlighter yang bisa anda gunakan pada website anda.

1. Hightlight.js

Hihglight.js bisa digunakan untuk 112 bahasa dan memiliki 49 style, dia akan otomatis mendeteksi bahasa yang digunakan, support lebih dari satu penggunaan bahasa, bisa digunakan untuk node.js dan juga kompatibel dengan sebagian besar framework javascript.

2. Jush JavaScript Syntax Highlighter

JavaScript Syntax Highlighter ini dapat digunakan untuk client-side syntax highlighter untuk bahasa-bahasa pemograman berikut: HTML, CSS, JavaScript, PHP, SQL, HTTP and SMTP protocol, php.ini dan Apache config.

3. Beauty of Code

Beauty of code salah satu sintax highlighter yang juga sering digunakan oleh developer, anda bisa cek langsung di website nya untuk info lebih lanjut tentang plugin ini

4. Google Code Prettify

Google Code Prettify adalah sebuah modul javascript dan file css yang memungkinkan anda menulis kode dari source code yang anda miliki dalam halaman website.

Google Code Prettify

5. Lighter for MooTools

Lighter adalah syntax highlight class yang dikembangkan untuk MooTools. Dibuat dengan MooTools developer dengan referensi dari beberapa fitur framework.

6. Syntax Highlighter

SyntaxHighlighter ini dibuat oleh Alex Gorbatchev, dan sepertinya inilah yang paling banyak digunakan website untuk menampilkan potongan kode program.

Syntax Highlighter

7. Quick Highlighter

Quick Highlighter ini bisa digunakan untuk menulis bahasa pemograman baik server-side maupun client-side

8. Snippet Code Highlighter

Snippet adalah jQuery plugin yang dibangun diatas skrip SHJS yang bisa ditemukan di SourceForge. Snipped menyediakan cara cepat dan mudah untuk menandai bagian tertentu dari potongan kode dalam halaman website HTML.

9. Syntax Highlighting in JavaScript

SHJS adalah sebuah program Javascript yang bisa menandai bagian source code dalam dokumen HTML. Banyak digunakan oleh developer untuk membangun sintax highlighter model lain nya.

10. Rainbows Syntax Highlighter

Rainbow adalah sebuah syntax highlighting library yang ditulis dalam Javascript, rainbow dirancang agar ringan (hanya 1,4kb), mudah digunakan, dan dapat di kembangkan. Dapat dikostumasi juga dengan css.

Rainbows

Itulah beberapa plugin Jquery syntax highlighter terbaik yang bisa anda gunakan untuk menuliskan dan menandai potongan kode program yang hendak anda tampilkan dihalaman website (HTML) dan tidak akan di eksekusi oleh browser.

Semoga berguna untuk anda semua yang sedang membangun website, jika anda memiliki referensi lain yang lebih baik, anda bisa menuliskan nya dalam kolom komentar agar informasi yang kami bagikan ini semakin berguna untuk orang lain, salam web design indonesia





Penulis :

Website yang berisi Tutorial, Tips, Trik, Inspirasi, Opini, Cerita, Studi kasus, dan berbagai hal menarik tentang Web Design, Web Development dan Graphic Design untuk orang-orang kreatif di Indonesia. View all posts by TWD Editorial

Comments

5 thoughts on “10 Syntax Highlighter Terbaik Untuk Menulis Kode di Halaman Website

  1. menurut om admin yang paling ringan yang mana ya ?

  2. Ariflaw says:

    Kalau aku lebih seneng yang simpel hee… Aku make EnlighterJS (plugin wp) .. Soalnya kita bisa milih tampilannya yang cocok sama themes web kita. Mau yang kelap atau terang.. juga ada pilihan untuk tampilan seperti github he..

  3. Gandara Fajar Umbara says:

    kalau di phyton rogue / pygments ya.

  4. jawad says:

    kenapa harus menggunakan javascript setelah download ?
    saya tidak mengerti,,
    biasanya menggunakan aplikasi seperti dreamweaver

    mohon maaf lancang karena saya masih SMK kelas 1 jurusan Multimedia

Leave a Comment

XHTML: You can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>


Klik Tombol Like / Suka ya kawan..

Klik tombol "Like" atau "Suka" untuk mendapatkan update tutorial, tips & tricks serta info terbaru seputar dunia web design & development