Cara Membuat Syntak,Code Dan Scrip Highlighting Pada Bloger - Pada Kali ini saya akan memberi tutorial tentang Membuat Syntak,Code Dan Scrip Highlighting ,sebelumnya saya akan jelaskan apa itu Scrip
Script adalah bahasa yang digunakan untuk menerjemahkan setiap perintah dalam situs yang pada saat di akses. Sebuah skrip pemrograman adalah kode yang dapat meningkatkan fungsionalitas dari sebuah situs web. Semakin banyak script yang digunakan maka akan terlihat semakin menarik, dan interaktif serta terlihat lebih bagus (biasanya loadnya lama) . Bahasa dasar yang di pakai setiap situs adalah HTM macam-macam script, PHP, ASP, JSP, Java Script, Java Applets, VBScript.
Lansung saja ya ..
Cara Membuat Syntak,Code Dan Scrip Highlighting Pada Bloger :
- Bukak Bloger Dan Login
- Kalau Sudah Login Masuk Ke Halaman Template , Edit HTML
<script>
//<![CDATA[
function downloadJSAtOnload(){var e=document.createElement("script");e.src="https://rawgit.com/mastamvan/backup/master/syntaxmas.js",document.body.appendChild(e)}window.addEventListener?window.addEventListener("load",downloadJSAtOnload,!1):window.attachEvent?window.attachEvent("onload",downloadJSAtOnload):window.onload=downloadJSAtOnload;
//]]>
</script>
<style type='text/css'>
pre{position:relative}
pre:before{-moz-user-select:none;font-size:15px;font-family:'Roboto,sans-serif';content:attr(title);position:absolute;top:0;padding:9px 0;left:0;right:0;color:#79798d;display:block;margin:0;text-indent:15px}
pre:after{-moz-user-select:none;display:inline-block;content:"\f121";font-family:fontAwesome;font-style:normal;font-weight:normal;font-size:18px;color:#79798d;top:0;right:0;padding:9px 14px;position:absolute}
pre[data-codetype="tamvanCSS"]:before,pre[data-codetype="tamvanHTML"]:before,pre[data-codetype="tamvanJS"]:before,pre[data-codetype="tamvanJQ"]:before{background-color:#fff;box-shadow:inset 0 0 0 1px #eee}
i.klik-url,pre,code{-webkit-user-select:all;-moz-user-select:all;-ms-user-select:all;user-select:all}
.hljs{display:block;padding:0.5em;background:#333;color:white;max-height:350px;overflow:hidden;border-radius:5px}
.hljs:hover{overflow:auto}
.hljs-name,.hljs-strong{font-weight:bold}
.hljs-code,.hljs-emphasis{font-style:italic}
.hljs-tag{color:#62c8f3}
.hljs-variable,.hljs-template-variable,.hljs-selector-id,.hljs-selector-class{color:#ade5fc}
.hljs-string,.hljs-bullet{color:#a2fca2}
.hljs-type,.hljs-title,.hljs-section,.hljs-attribute,.hljs-quote,.hljs-built_in,.hljs-builtin-name{color:#ffa}
.hljs-number,.hljs-symbol,.hljs-bullet{color:#d36363}
.hljs-keyword,.hljs-selector-tag,.hljs-literal{color:#fcc28c}
.hljs-comment,.hljs-deletion,.hljs-code{color:#888}
.hljs-regexp,.hljs-link{color:#c6b4f0}
.hljs-meta{color:#fc9b9b}
.hljs-deletion{background-color:#fc9b9b;color:#333}
.hljs-addition{background-color:#a2fca2;color:#333}
.hljs a{color:inherit}
.hljs a:focus,.hljs a:hover{color:inherit;text-decoration:underline}
</style>
- Ok kita Tinggalkan Halaman Edit HTML
- Selanjutnya Kita Masuk Halaman Posting Dan Masukan Code Dibawah ini Untuk Pembungkus
Kode Pembungkus CODE
<pre data-codetype="tamvanHTML" title="CODE">
<code>
<!--Taro Kode Kalian Disini--> .OTAKKAMI.COM
</code>
</pre>
OK Sekiyan Tutorial OtakKami, Untuk Selanjutnya Next Time YA...
- Kalau Kurang Jelas Bisa Comment Di Bawah Ini...
- Baca Juga :