Cakar Media | Apa sih Syntax itu ? Oke, langsung jawab ya... Syntax itu merupakan struktur bahasa pemerograman atau tata cara penulisan bahasa pemerograman, namun apa saja bahasa pemerograman itu? waduh kalau mau di jawab banyak sekali ya mas broo..secara umum penulisan syntax itu diberikan kaidah-kaidah tertentu oleh sebuah program yang akan dibuat, contohnya dalam penulisan program PHP jika ingin membuat variabel maka harus diawali dengan tanda $ atau jika ingin menulis skrip PHP harus diawali dengan tanda buka Tag <?php, untuk memahami si penulis agar tidak tersesat atau pusing dalam penulisan koding/syntax untuk itu dibutuhkan sebuah program teks editor yang ada Syntax Highlighther, fungsinya untuk mengetahui bagian-bagian elemen skrip sesuai dengan indikator warna.
Nah! Jika anda seorang programer yang rajin bagi-bagi kan skrip programnya melalui blog, web terkadang memerlukan sebuah halaman blog atau web yang support dengan Syntax Highlighther nya, agar si pembaca juga dapat memahaminya secara baik, jadi nggak bikin PUYENGG! Oke lah langsung aja ya sobb kita ke TKP...
langkah yang pertama, anda sudah login ke Blogger anda jika menggunakan Blogspot, dan masuk ke Dashbor lalu pilih menu Template setelah itu pilih edit HTML
Setelah itu, ada baiknya anda BackUp terlebih dahulu template Blog anda, agar jika nanti ada kesalahan anda punya BackUpannya, cara backUpnya anda pasti sudah paham kannnnn..
berikutnya cari dengan CTRL+F dan temukan kode ini :
]]></b:skin>jika sudah ketemu kodenya, lalu Copy kode dibawah ini (inget kode nya saja tidak pakai Nomor urut ya) dan letakan tepat di bawah
]]></b:skin><link href='http://alexgorbatchev.com/pub/sh/2.1.382/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/2.1.382/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shCore.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCpp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCSharp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCss.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shYouBrushJava.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushJScript.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPhp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPython.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushRuby.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushSql.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushVb.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushXml.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPerl.js' type='text/javascript'/>
<script language='javascript'>
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/2.1.382/scripts/clipboard.swf';
SyntaxHighlighter.all();
</script>
Setelah selesai simpan template.
Sebagai catatan,
1. karena sumber kode nya di load dari situs alexgorbatchev.com maka akan terasa berat sekali, jika anda mau ringan maka anda harus menyimpan skrip/kode tersebut di hostingan google atau google drive punya anda. adapun cara-caranya anda bisa baca artikelnya di google dengan kata kunci "cara menyimpan file kode di google".
2. Jika anda ingin load nya ringan gunakan script yang dari gorbatchev itu sesuai dengan kebutuhan saja, misalkan anda ingin membuat tutorial sepesialis php, css, dan xml maka copy scriptnya di blog anda.
<link href='http://alexgorbatchev.com/pub/sh/2.1.382/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/2.1.382/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCss.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPhp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushXml.js' type='text/javascript'/>
Cara Memasukan SyntaxHighlighther di dalam PostinganOKE kita lanjutkan, setelah anda menyimpannya sekarang and coba untuk membuat postingan yang didalamnya terdapat koding/syntax, caranya
Buatlah judul postingan sesuai dengan kemauan anda (dengan mode compose bukan HTML)
Buatlah postingan pembuka/kalimat pembuka (dengan mode compose bukan HTML)
Masukan koding/syntax nya (dengan mode compose bukan HTML)
Lalu masukan perintah Highlighternya (gunakan mode HTML)
contoh kode apitan, kode apitan ini diawali dengan perintah
<pre class="brush:php">jika anda ingin mengganti dengan jenis css tinggal ganti saja php nya menjadi
<pre class="brush:css"> dan di akhiri dengan tanda tag
</pre><pre class="brush:php">Kode tutorial anda disini
</pre>contoh gambar Penulisan Mode Compose
Setelah anda menulis di mode Compose selesai Masukan kode apitannya.
contoh gambar Penulisan Mode HTML
Setelah semua selesai, simpan tulisan anda, dan publish atau publikasikan, dan hasilnya akan seperti dibawah ini :
Nah! itulah sekelumit cara-cara memasang Syntax Highlighter di Blog anda, semoga bermanfaat, mohon maaf jika ada kekurangannya dari postingan ini, jika ada yang mau menambahkan silahkan di share ilmunya ya,,hehee.. Terima Kasih.