Penambahan judul otomatis ini biasanya sering digunakan pada tag PRE dengan Vanilla Style. Bagi sobat yang ingin menggunakan nya, silahkan simpan kode ini di atas
]]></b:skin>
atau </style>
pre[data-codetype]:before {
content:attr(data-codetype);
display:block;
margin:-11px -13px 10px -54px;
padding:8px 12px;
font-family:Arial,Sans-serif;
font-size:14px;
text-transform:uppercase;
background-color:#41749f;
color:white
}
pre[data-codetype="CSS"]:before{background-color:#5fbbba}
pre[data-codetype="HTML"]:before{background-color:#4fc1eb}
pre[data-codetype="JavaScript"]:before{background-color:#ff6c60}
pre[data-codetype="JQuery"]:before{background-color:#99c262}
Bagi sobat yang menggunakan tag
blockquote
apabila ingin menggunakan cara ini, tinggal mengganti CSS diatas dari pre
menjadi blockquote
.Untuk penulisan, tambahkan
data-codetype="JenisKode"
seperti contoh di bawah ini<pre data-codetype="CSS"><code>...........</code></pre> /* Untuk CSS */
<pre data-codetype="HTML"><code>...........</code></pre> /* Untuk HTML */
<pre data-codetype="JavaScript"><code>...........</code></pre> /* Untuk JavaScript */
<pre data-codetype="JQuery"><code>...........</code></pre> /* Untuk kode JQuery */
dst...