Cara Membuat Syntax Highlighter Otomatis Terbaru di Blogger

Cara Membuat Syntax Highlighter Otomatis Terbaru di Blogger-Untuk para blogger yang ingin memasang Syntax Highlighter, kali ini saya ingin berbagi cara pembuatannya. Tentu Anda tau kan maksud dari judul diatas. jikalau Anda belum tau, Syntax Highlighter adalah kotak yang biasanya berisi kode script, html, css, JavaScript, jQuery. Baca Juga: Cara daftar Google Adsense Agar diterima

Dengan menggunakan Syntax Highlighter maka tampilan blog akan lebih rapih dan profesional. Karena memberikan tampilan yang bagus dan setiap script akan terlihat warna warni. Jika Anda menggunakan Wordpres akan lebih mudah dalam pemasangan Syntax Highlighter, karena dapat menginstall plugin.

Panduan Membuat Syntax Highlighter Otomatis Terbaru di Blogger

  • Pertama Login ke akun blogger sobat
  • Pada bagian dashboard pilih Template lalu Edit HTML
  • Copy dan paste kode dibawah ini tepat diatas kode ]]></b:skin>
/* syntax highlighter Otomatis */
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}
  • Selanjutnya copy lagi kode dibawah ini tepat diatas kode </head>
<script src='https://googledrive.com/host/0B8a75E285BMHMDVkVGY1dUhzUUE' type='text/javascript'/>
  • Terakhir Simpan

Untuk penempatan Syntax Highlighter pada artikel blog langkah selanjutnya buat postingan/artikel terlebih dahulu lalu masukan kode dibawah ini Tab HTML

<pre><code> 

Kode JavaScript, jQuery atau CSS masukkan disini

</pre></code>

Demikian untuk artikel kali ini tentang Cara Membuat Syntax Highlighter Otomatis Terbaru di Blogger, semoga artikel kali ini dapat bermanfaat. Untuk Anda yang masih belajar ngeblog, silahkan lihat Panduan Membuat blog dan Optimasi Seo Untuk Pemula

Baca Juga Cara Membuat toko online dengan mudah | CARA DAN KUMPULAN KERAJINAN UNIK DAN KEREN

Leave a Reply

Your email address will not be published. Required fields are marked *

Read previous post:
Kumpulan DP BBM Bergerak Ramadhan 2016

Kumpulan DP BBM Bergerak Ramadhan 2016-Bulan suci ramadhan memang bulan...

Close