mungkin bagi seorang bloger yang sering menulis / membuat sebuah artikel yang isinya dengan code-code pemrograman sudah tidak asing lagi dengan namanya Syntax highlighter dan pasti sudah terpasang di blognya. Dan bagi seorang bloger newbie seperti saya yang pengen membuat sebuah artikel yang isinya dengan code-code pemrograman istilah syntax highlighter sangat asing terdengar di telinga kita .
Oke kali ini saya akan menjelaskan apa sih itu syntaxt highlighter . Syntaxt highlighter adalah kode stabilo, Syntax ini banyak digunakan pada website dan blog, biasanya syntax ini di gunakan pada web dan blog designer dan programer atau yang ingin menampilkan kode pada halaman posting yang berisi kode script. sintaxs opensource ini sangat sederhana dan ringan untuk sebuah kode script, Syntax Highlighter ini di kembangkan oleh Alex Gorbatchev.
Bagaima Cara Memasangnya ?
Di atas saya sudah menjelaskan sedikit tentang apa itu syntaxt Highlighter dan sekarang kita akan menerapkan syntax Highlighter pada blog kita ayo kita ikuti tutorial yang ada di bawah ini :
1. Buka akun blogger Anda.
2. Pilih menu template,klik edit Html
3. Silahkan anda copy kode di bawah dan taruh tepat di atas kode </head>
<script src='http://procejct-saeful13.googlecode.com/svn/JS/SyntaxHighlighter.js' type='text/javascript'/> 4. Selanjutnya copy kode di bawah ini dan letakan tepat di atas kode ]]></b:skin>
/*syntax highlighter*/
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} Untuk Cara Penggunaannya Ikuti Langkah Di bawah ini :
Gunakan kode <pre><code> Masukkan JavaScript atau CSS </pre></code> Pada menu Html saat anda membuat posting, dan isikan code script yang akan di tambahakan pada menu compose.
