Tutorial Membuat Syntax Highlighter Dalam Artikel

Tutorial Membuat Syntax Highlighter Dalam Artikel - Hallo sahabat, Selamat Datang di Website cara gampang cari uang, Silahkan menikmati Tutorial Membuat Syntax Highlighter Dalam Artikel dari kami, Dan jangan lupa untuk menikmati Artikel kami yang lainnya, Terima kasih.

Cara mencari uang di internet!

Apa itu Syntax Highlighter?

Syntax Highlighter adalah fitur dari beberapa teks editor untuk menampilkan teks khususnya adalah Source Code dalam berbagai warna, font sesuai dengan istlah kategori.

Fitur Syntax Highlighter ini juga memudahkan para penggunanya pada saat menulis bahasa yang terstruktur seperti bahasa pemrograman atau bahasa markup.Contohnya seperti:

HTML , CSS , JAVASCRIPT , PHP , dll.

Bagaimana cara membuat Syntax Highlighter?

-Masuk ke Theme > Edit HTML > CTRL+F (Pada Windows) Command+F (Pada Mac) cari </head>

-Copy dan Paste kode dibawah ini tepat di atas </head>

<style>

/*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}

</style>

-Kemudian cari lagi dengan CTRL+F (Pada Windows) Command+F (Pada Mac) kode </body>

-Copy dan paste kode dibawah ini tepat di atas </body>

<script type="text/javascript">

//<![CDATA[

function downloadJSAtOnload(){var e=document.createElement("script");e.src="http://www.erllang.ga/js/syntax-highlighter.js",document.body.appendChild(e)}window.addEventListener?window.addEventListener("load",downloadJSAtOnload,!1):window.attachEvent?window.attachEvent("onload",downloadJSAtOnload):window.onload=downloadJSAtOnload;

//]]>

</script>

-Silahkan Save Theme

-Untuk menggunakan Syntax Highlighter pada artikel kalian,silahkan tambahkan kode dibawah ini di dalam Post HTML kalian tepat di kode yang mau kalian highlight

<pre><code>

Silahkan masukkan code HTML kalian disini

</pre></code>

Done,silahkan kalian liat hasilnya
Beri saya waktu sejenak untuk menjelaskan kepada Anda cara mudah dan praktis untuk mendapatkan uang!

Cara cari uang di internet!

Sekian dulu Tutorial Membuat Syntax Highlighter Dalam Artikel dari kami, Semoga Tutorial Membuat Syntax Highlighter Dalam Artikel ini bermanfaat untuk anda dan Silahkan menikmati Artikel kami yang lainnya, Terimakasih.