Tutorial Membuat Kotak Kode Script HTML atau CSS Dalam Postingan Blog

Tutorial Membuat Kotak Kode Script HTML atau CSS Dalam Postingan Blog - Salam sahabat gamebhot, terima kasih atas kesediaannya mengunjungi situs ini, semoga dengan adanya situs webBlog ini, bisa mendapat informasi tentang Tutorial Membuat Kotak Kode Script HTML atau CSS Dalam Postingan Blog.. Semogga artikel ini bermanfaat dan jangan sungkan memberi keritik , kami akan selalu menerima kritikan demi majunya artikel ini. dan jangan lupa shere ya artikel ini, karena satu shere dari kalian sangan bernilai bagi kami,OK Terima kasih semogga sehat selalu para pengunjung.

Tutorial Membuat Kotak Kode Script HTML atau CSS Dalam Postingan Blog. Agar terlihat rapi mungkin sahabat blogger ingin kode Script HTML nya tersusun rapi dalam kotak dalam postingan, mungkin sahabat bisa mencoba ini.
Silahkan ikutu tutorial berikut :

Masuk ke Blogger
Pilih Tema atau Template Di saran kan Cadangkan atau backup template anda
Klik edit HTML Cari kode ]]</b:skin> dengan menekan tombol CTRL+F
Copas kode berikut diatasnya

/* CSS Syntax Highlighter */ pre{-webkit-user-select:text;-khtml-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;padding:0;margin:.5em auto;white-space:pre;word-wrap:break-word;overflow:auto;background-color:#443e50;position:relative;padding-top:33px;width:100%;-moz-tab-size:2;-o-tab-size:2;tab-size:2;word-break:normal;-webkit-user-select:text;-khtml-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;border-radius:3px;} pre::-webkit-scrollbar,pre::-moz-scrollbar,pre code::-webkit-scrollbar,pre code::-moz-scrollbar,code::-webkit-scrollbar,code::-moz-scrollbar {display:none;} pre::before{font-size:15px;font-weight:700;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{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 code{display:block;background:none;border:none;color:#bec3ce;padding:25px 20px 20px 20px;font-family:'Source Code Pro',Open Sans Condensed,Consolas,Monaco,monospace;font-size:.83rem;white-space:pre;overflow:auto} code .token.important {font-weight:bold;} code .token.entity {cursor:help;} pre mark,code mark,pre code mark {background-color:#3498db!important;color:#fff!important;padding:2px;margin:0 2px;border-radius:2px;} pre[data-codetype="CSSku"]:before,pre[data-codetype="HTMLku"]:before, pre[data-codetype="JavaScriptku"]:before,pre[data-codetype="JQueryku"]:before{background-color:#fff;box-shadow:inset 0 0 0 1px #eee;}

Tutorial Pemasangan kotak HTML :

Setelah selesai,
Buatlah postingan yang akan ditambahkan kotak kode script
Pastikan dulu dimana letak kotak kode script akan kamu tempatkan
Kemudian beralih dari mode Compose ke mode HTML
Copas kode ke dalam kolom postingan HTML

<pre data-codetype="CSSku" title="CSS"> <code class="language-markup">Kode scriptnya disini</code> </pre>

download

Terima kasih anda sudah membaca articel Tutorial Membuat Kotak Kode Script HTML atau CSS Dalam Postingan Blog

Jika anda menemukan Link mati atau Link tidak berfungsi, silahkan hubungi kami melalui kontak person di atas, agar segera di perbaiki dan bisa berfungsi kembali. Terima kasih ...