Cara Membuat Syntax Highlighter di Blog
Membahas tentang bagaimana caranya agar blog yang kita buat bisa menampilkan code yang kita buat dari sebuah bahasa pemrograman seperti HTML dan bahasa bahasa pemrograman lainnya agar dapat tampil dengan rapi dan sempurna di blog yang kita buat, maka tentunya membutuhkan sedikit modifikasi dari template blog kita agar semua berjalan mulus dan lancar.
kali ini saya akan menguraikan secara detail permasalahan yang teman-teman hadapi semua, semoga dengan artikel ini bisa membantu teman-teman semua yang ingin share code pemrograman di blog yang teman-teman semua agar tampil rapi dan professional serta mudah dibaca oleh pengunjung blog.
Pengertian Syntax Highlighter adalah sebuah proses pemindahan kode bahasa pemrograman dengan tulisan, warna text, posisi yang sama persis dengan yang terdapat pada sebuah kode
bahasa pemrograman sebelumnya untuk dapat di pindahkan dalam bentuk tulisan lain supaya lebih mudah pengunjung membaca
atau mempelajarinya.
Syntax Highlighter ini hampir sama dengan fitur Blockquote akan tetapi
bedanya pada fitur blockquote warna teks yang biasanya hanya mempunyai satu
warna saja, untuk merubah warna sesuai dengan kode aslinya, maka harus dilakukan dengan cara manual. Jadi intinya Syntax highlighter akan
efektif jika dalam proses pembuatan atau pemindahannya bila
dibandingkan dengan fitur blockquote. Karena dengan Syntax Highlighter ini bisa mempercantik tampilan sebuah coding yang disajikan agar pembaca mudah memahami sebuah kode yang teman-teman share di blog anda.
Cara membuatnya sangatlah gampang, ikuti petunjuk yang penulis share dengan seksama:
1. Login Blogger > Template > Klik Edit HTML
2. Selanjutnya tambahkan kode di bawah ini sebelum </Head> Seperti gambar dibawah ini :
Download Kode Pertama Disini
3. Selanjutnya tambahkan kode di bawah ini sebelum </body>.
Download Kode Kedua Disini
Cara Pemakaian nya adalah tulis kode seperti dibawah ini pada saat akan memposting kode pemrograman yang ingin anda share atau bagikan di blog sobat.
<pre><code>Masukkan_Kode_CSS/HTML/JavaScript_Disini</code></pre>4. Jangan lupa simpan template anda.
Terima kasih sudah berkunjung
