Cara membuat syntax highlighter pada blog dengan mudah - Hallo sahabat OBODRINK, Pada Artikel yang anda baca kali ini dengan judul Cara membuat syntax highlighter pada blog dengan mudah, kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan Artikel Tutorial, yang kami tulis ini dapat anda pahami. baiklah, selamat membaca.

Judul : Cara membuat syntax highlighter pada blog dengan mudah
link : Cara membuat syntax highlighter pada blog dengan mudah

Cara membuat syntax highlighter pada blog dengan mudah

Obodrink.com - Caranya bagaimana untuk membikin syntax higlighter pada blogger? Sebetulnya apa sih kegunaan Syntax pada blog? Jawabannya dapat kalian temui di blog obodrink ini. Oleh karena itu, bacalah panduan syntax highlighter ini sampai akhir. 

Syntax highlighter begitu penting bagi blogger yang menggunakan coding untuk membahas tutorial di blog mereka. Ini karena syntax higlighter dengan jelas membedakan antara teks biasa dan bagian pengkodean. 

Selain itu, kode yang ditampilkan pada artikel akan terlihat lebih nyaman. Oleh karena itu, ada  variasi warna dan nomor baris kode yang berbeda. Ya, mirip dengan software editor teks  seperti Notepad. Jadi, bagaimana cara kalian untuk membuat syntax highlighter ini? Lihat tutorialnya di bawah ini.

Cara membuat syntax highlighter pada blog

Sebelum kalian mengaplikasikan kode syntax ini, ada baiknya kalian back-up terlebih dahulu agar bila terjadi eror tidak kebingungan.

1. pertama kalian akses Blogger.com

2. Kemudian klik menu Tema

3. lalu klik Edit HTML

4. Kalian Cari dan temukan kode ]]></b:skin>

5. Apabila telah ditemukan, salin kode berikut ini dan letakkan tepat di bawah kode ]]></b:skin>

<link href='https://alexgorbatchev.com/pub/sh/2.1.382/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='https://alexgorbatchev.com/pub/sh/2.1.382/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
<script src='https://alexgorbatchev.com/pub/sh/2.1.382/scripts/shCore.js' type='text/javascript'/>
<script src='https://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCpp.js' type='text/javascript'/>
<script src='https://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCSharp.js' type='text/javascript'/>
<script src='https://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCss.js' type='text/javascript'/>
<script src='https://alexgorbatchev.com/pub/sh/current/scripts/shYouBrushJava.js' type='text/javascript'/>
<script src='https://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushJScript.js' type='text/javascript'/>
<script src='https://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPhp.js' type='text/javascript'/>
<script src='https://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPython.js' type='text/javascript'/>
<script src='https://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushRuby.js' type='text/javascript'/>
<script src='https://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushSql.js' type='text/javascript'/>
<script src='https://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushVb.js' type='text/javascript'/>
<script src='https://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushXml.js' type='text/javascript'/>
<script src='https://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPerl.js' type='text/javascript'/>
<script language='javascript'>
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.config.clipboardSwf = &#39;https://alexgorbatchev.com/pub/sh/2.1.382/scripts/clipboard.swf&#39;;
SyntaxHighlighter.all();
</script>

6. Terakhir klik Simpan Tema

Apabila Syntax highlighter telah ditambahkan pada blog, kalian ikuti cara penggunaanya dibawah ini.

Cara penggunaan syntax highlighter

Apabila ketika kalian ingin menambahkan kode pada artikel, kalian gunakan kode/tag berikut:

<pre>kodenya di sini</pre>

Untuk penggunaan kode syntax highlighter sama juga, bedanya hanya kalian perlu menambahkan atribut Class contohnya:

<pre class="brush:html">
kodenya di sini
</pre>

Kode yang di atas, akan meng-highlight tipe kode yang disebut pada brush. Tipe kode yang didukung highlight yaitu CSS HTML Javascript PHP SQL dan Python 

[brush:css - brush:html - brush:js - brush:php - brush:sql - brush:python]. 

Catatan: kode yang mau ditampilkan pada artikel, wajib kalian Parse terlebih dulu agar kode bisa tampil.

Satu diantaranya tool parse online yang dapat kalian pakai yaitu Blogcrowds. Tools tersebut bisa dipakai dengan gratis dan bebas. 

Begitulah pembahasan pada artikel kali ini tentang cara membuat highlighter ini dan mudah-mudahan kalian berhasil mengaplikasikannya.

Demikianlah Artikel Cara membuat syntax highlighter pada blog dengan mudah

Sekianlah artikel Cara membuat syntax highlighter pada blog dengan mudah kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya.

Anda sekarang membaca artikel Cara membuat syntax highlighter pada blog dengan mudah dengan alamat link https://www.obodrink.com/2021/11/cara-membuat-syntax-highlighter-pada-blog.html

Bagikan Artikel ini