Skip to content Skip to sidebar Skip to footer
Home / Blogger / CSS / PHP / Web Programming

Syntax Highlighter Simple Untuk Blog

By Anonymous Post a Comment
Syntax Highlighter biasanya memang diperlukan untuk blog - blog yang sering membuatkan isyarat CSS, Javascript, HTML, PHP dll. Sebenarnya kita dapat saja menuliskan kode/membagikan sebuah isyarat secara langsung, maksudnya di copy paste ke halaman blog, tapi kalau kode/script yang kita bagikan panjang, maka susunan isyarat yang kita bagikan tersebut pastinya akan terlihat acak-acakan dan membuat postingan blog menjadi terlalu panjang.

Supaya penulisan isyarat atau script yang kita bagikan terlihat lebih rapi dan tertata, maka kita memerlukan Syntax Highlighter. Untuk membuat Syntax Highlighter kita spesialuntuk perlu menambahkan susunan isyarat CSS ke template blog, kemudian juga sedikit aksesori Javascript yang dapat di hosting di Google Drive ataupun juga dapat kita hosting ke website yourjavascript.com. Tekniknya memang hampir sama menyerupai Teknik cepatdangampang Membuat Blok Warna Dalam Postingan Blog , spesialuntuk saja disini kita membutuhkan aksesori Javascript

Dibawah ini yakni cara - cara untuk membuat Syntax Highlighter Simple Untuk Blog
  1. Seperti biasa masuk ke sajian Template > Edit HTML
  2. Cari isyarat <b:skin><![CDATA[/* atau biar lebih cepat tekan CTRL+F
    Syntax Highlighter biasanya memang diperlukan untuk blog Syntax Highlighter Simple Untuk Blog
  3. Kemudian kalau sudah ditemukan copy script dibawah ini dan taruh dibawahnya 
     /* syntax highlighter ROOT93 */ pre{padding:.8em 1em;margin:0.5em 0;background-color:#F7F7F9;border:1px solid #ddd;font-size:13px;color:#000;font-family:Consolas,Monaco,'Andale Mono','Courier New',Courier,Monospace;line-height:1.4em;position:relative;white-space:pre-wrap;word-wrap:break-word;overflow:auto;max-height:200px} code{font-family:Consolas,"Andale Mono WT","Andale Mono","Lucida Console","Lucida Sans Typewriter","DejaVu Sans Mono","Bitstream Vera Sans Mono","Liberation Mono","Nimbus Mono L",Monaco,"Courier New",Courier,Monospace;font-size:13px;color:#d14} pre code{padding:0!important;color:#839496;background:none!important;border:none!important;display:block} pre .comment,pre .template_comment,pre .diff .header,pre .doctype,pre .pi,pre .lisp .string,pre .javadoc{color:#93a1a1;font-style:italic} pre .keyword,pre .winutils,pre .method,pre .addition,pre .css .tag,pre .request,pre .status,pre .nginx .title{color:#F5821E} pre .number,pre .command,pre .string,pre .tag .value,pre .rules .value,pre .phpdoc,pre .tex .formula,pre .regexp,pre .hexcolor{color:#008800} pre .title,pre .localvars,pre .chunk,pre .decorator,pre .built_in,pre .identifier,pre .vhdl .literal,pre .id,pre .css .function{color:#268bd2} pre .attribute,pre .variable,pre .lisp .body,pre .smalltalk .number,pre .constant,pre .class .title,pre .parent,pre .haskell .type{color:#A2886F} pre .preprocessor,pre .preprocessor .keyword,pre .shebang,pre .symbol,pre .symbol .string,pre .diff .change,pre .special,pre .attr_selector,pre .important,pre .subst,pre .cdata,pre .clojure .title,pre .css .pseudo{color:#000;font-weight:bold} pre .deletion{color:#dc322f} pre .tex .formula{background:#eee8d5}

  4. Terakhir menambahkan script dibawah ini dibawah isyarat <head> atau sebelum isyarat </head>
    <script src="http://yourjavascript.com/16724112645/root93.js" type="text/javascript">
Pada tahap ini pembuatan Syntax Highlighter sudah selesai, setiap kali ingin menuliskan sebuah isyarat CSS, HTML, PHP dll, maka Anda cukup beralih dari mode Compose ke mode HTML kemudian masukan isyarat yang ingin Anda menambahkan/tampilkan didalam postingan blog kedalam tag diberikut :

<pre><code> Disini masukan Kode, PHP, Javascript, HTML dlll </code></pre>

Catatan* Sebelum Anda memasukan isyarat khususnya kode/script PHP, HTML, Javascript, kedalam tag <pre> Anda terlebih lampau harus melaksanakan parse terhadap script yang ingin Anda menambahkan memakai Kode Parse HTML yang juga tersedia di blog ini

Syntax Highlighter biasanya memang diperlukan untuk blog Syntax Highlighter Simple Untuk Blog
Syntax Highlighter Simple Untuk Blog yang saya bagikan ini yakni Syntax Highlighter sederhana. Anda juga dapat merubah background warna dari Syntax Highlighter sesuai dengan impian dengan merubah properti css background-color:#F7F7F9 Untuk isyarat warna dapat Anda lihat pada halaman Kode Warna Lengkap melaluiataubersamaini Nama

Post a Comment for "Syntax Highlighter Simple Untuk Blog"