Dengan menggunakan "Syntax Highlighter" ini dapat memperpendek isi dari Source Code yang kalian bagikan untuk pengunjung agar tidak terlihat panjang dengan begitu akan membuat pengunjung menjadi lebih nyaman karena tidak perlu scroll yang panjang cukup double klik / tap dengan mudah di copy.
Bagaimana tampilan nya ? mungkin itu yang ingin diketahui oleh kalian bukan ? daripada penasaran coba di cek dulu "Demo" untuk "Syntax Highlighter" tersebut dibawah :#
Untuk menambahkan ke "Blogger" kalian tinggal ikuti langkah dibawah ini
Cara Membuat Syntax Highlighter di Blog
1. Buka Blogger
2. Klik Tema > Klik "Edit HTML"
3. Tambahkan kode berikut tepat dibawah kode <style> atau <b:skin>
.post-body pre {
background-color: #292E34; /* warna background */
border-left: 5px solid #008c5f; /* variasi border kiri */
padding:0; margin:.5em auto; white-space:pre; word-wrap:break-word; overflow:auto; position:relative; width:100%; -moz-tab-size:2; -o-tab-size:2; tab-size:2; word-break:normal; user-select:text; -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
}
.post-body pre code {
color: #BFBF90; /* warna huruf */
font-size: 12px; /* ukuran huruf */
max-height:250px; line-height:1.5em; display:block; background:none; border:none; padding:10px 15px; font-family:'source code pro',menlo,consolas,monaco,monospace; white-space:pre-wrap; overflow:auto; user-select:text; -webkit-user-select:text; -khtml-user-select:text; -moz-user-select:text; -ms-user-select:text; user-select:text
}
4. Tambahkan kode berikut saat mau membuat artikel pada Tab "HTML"<pre><code>
<!-- Masukkan semua kode CSS, HTML atau Javascript disini -->
</pre></code>
5. Simpan Tema6. Selesai
Bagaimana hasilnya ? sama bukan dengan yang tampilan "Demo" tampilan nya sederhana tapi menarik mata kalian :3
Sampai disini saja dulu dan artikel pada blog ini akan terus saya update Setiap Hari meskipun cuman Satu atau Dua saja tapi itu lebih baik daripada Tidak :#
Post a Comment
Post a Comment