Lompat ke konten Lompat ke sidebar Lompat ke footer

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>.

Penampakan Theme Saya

















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

Developer Pidie
Developer Pidie Programming, Blogging Youtuber "The best of people among you are those who benefit others the most."