Minggu, 20 Agustus 2017

Update Code Auto Syntax Highlighter Prettyprint js

syntax Highlighter
Jumpa lagi dengan topik JavaScript Dan jQuery. Sebelumnya saya sudah share Cara menambah syntax highlighter dengan prettyprint di blog tanpa mengurangi kecepatan loading website 100% Work Tested, namun kali ini saya improvisasi codenya jadi lebih ringan dan simpel.
Note: Taruh kode dibawah ini diatas </body></html>

//Defer Syntax Higlighter
function downloadJSAtOnload() {
(function(scripts) {
var i = 0,
l = scripts.length;
for (; i<l; ++i ){
var element = document.createElement("script");
element.src = scripts[i];
document.body.appendChild(element);
}
})(['https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js?lang=css&skin=sunburst']);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;

$("pre").addClass("prettyprint");
Cara penggunaannya sama dengan artikel sebelumnya » Cara menambah syntax highlighter dengan prettyprint di blog tanpa mengurangi kecepatan loading website 100% Work Tested « yang membedakan hanya kode pemanggil Syntax Highlighter nya lebih simple dan ringan.
Deskripsi Fungsi Kode Diatas:
['https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js?lang=css&skin=sunburst']: Berfungsi memanggil prettyprint sekaligus style sunburst.css.
['https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js?lang=css&skin=sunburst']: Kode tebal bergaris bawah (sunburst) bisa diganti dengan:
Pilih salah satu

  • desert
  • doxy
  • sons-of-obsidian
  • sunburst

  • Cek Disini Untuk Melihat Efek Style

    Artikel Terkait