SyntaxHighlighter Auto Detect Language

Cara Memasang SyntaxHighlighter Auto Detect Language di Blogger - Halo pembaca setia blog amburadul ini kali ini Tutorial Blogger akan share cara memasang SyntaxHighlighter Auto Detect Language di blog. Apa bedanya dengan SyntaxHighlighter dengan Prism? Bedanya SyntaxHighlighter Auto Detect Language ini nggak harus memasukkan kode secara spsifik saat pemanggilan, cukup <pre><code>code css/html </code></pre> jadi bisa lebih simpel dan memudahkan saat mau menggunakanya. Jadi, berminat untuk memsangnya? Jika berminat, berikut caranya.

Letakan kode dibawah ini diatas </head>
<script src='//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.7.0/highlight.min.js'/> <script> hljs.initHighlightingOnLoad(); </script>
Lalu Letakan CSS ini di atas </style> atau ]]></b:skin>
/* Original highlight.js style (c) Ivan Sagalaev <maniac@softwaremaniacs.org> */ .hljs { display: block; overflow-x: auto; padding: 0.5em; background: #F0F0F0; } /* Base color: saturation 0; */ .hljs, .hljs-subst { color: #444; } .hljs-comment { color: #888888; } .hljs-keyword, .hljs-attribute, .hljs-selector-tag, .hljs-meta-keyword, .hljs-doctag, .hljs-name { font-weight: bold; } /* User color: hue: 0 */ .hljs-type, .hljs-string, .hljs-number, .hljs-selector-id, .hljs-selector-class, .hljs-quote, .hljs-template-tag, .hljs-deletion { color: #880000; } .hljs-title, .hljs-section { color: #880000; font-weight: bold; } .hljs-regexp, .hljs-symbol, .hljs-variable, .hljs-template-variable, .hljs-link, .hljs-selector-attr, .hljs-selector-pseudo { color: #BC6060; } /* Language color: hue: 90; */ .hljs-literal { color: #78A960; } .hljs-built_in, .hljs-bullet, .hljs-code, .hljs-addition { color: #397300; } /* Meta color: hue: 200 */ .hljs-meta { color: #1f7199; } .hljs-meta-string { color: #4d99bf; } /* Misc effects */ .hljs-emphasis { font-style: italic; } .hljs-strong { font-weight: bold; }
Untuk CSS kalian bisa memilih sesuai keinginan, silahkan ambi DISINI
Dan untuk melihat demonya, silahkan lihat DISINI

Jangan lupa Save template agar perubahanya tersimpan. Gimana lebih mudah kan? dan untuk pemanggilanya menggunakan
<pre><code>code css/html </code></pre>
Tapi kembali lagi, semua tergantung pengguna, semua tergantung selera masing-masing :)
Selamat mencoba, semoga berhasil :D

SyntaxHighlighter Auto Detect Language 2016-10-02T13:18:00+07:00 Rating: 4.5 Diposkan Oleh: Anonymous