Hướng dẫn này sẽ làm cho khung code của bạn đẹp và dễ nhìn hơn:
Khung code bình thường
Khung code dùng Google code prettify
Bước 1: ACP >> Display >> Pictures and Colors >> Colors >> CSS Stylesheet
Bước 2: ACP >> Modules >> HTML & JAVASCRIPT >> Javascript Codes >> Create a new javascript: In the topics
Javascript Code * :
- Phân dòng code
- Màu riêng cho các phần tử, biến, hàm...
- Chọn toàn bộ khi nhấn vào tiêu đề khung Code
- Sửa lỗi màu trên punBB
Khung code bình thường
Khung code dùng Google code prettify
Bước 1: ACP >> Display >> Pictures and Colors >> Colors >> CSS Stylesheet
- Code:
.codebox dd.cont_code{background:#FFF;max-height:100%;overflow:auto;border:1px solid #e2e2e2;margin:0;padding:0}
.cont_code > code{white-space:pre;display:block;line-height:17px;padding:10px}
/* Code prettify */
.prettyprint.linenums{box-shadow:inset 50px 0 0 #eeeeee, inset 51px 0 0 #ececf0}
.prettyprint ol.linenums{padding-left:44px;margin:0;list-style-type: decimal;}
.prettyprint ol.linenums li{padding-left:12px!important;color:#999;line-height:10pt;text-shadow:0 1px 0 #fff;margin-bottom:5px}
.pln{color:#48484c}
@media screen {
.lit{color:#195f91}
.fun{color:#dc322f}
.str,.atv{color:#D14}
.kwd,.tag{color:#1e347b}
.typ,.atn,.dec,.var{color:teal}
.com,.pan,.opn,.clo{color:#93a1a1}
}
@media print,projection {
.com{color:#600;font-style:italic}
.typ{color:#404;font-weight:700}
.lit{color:#044}
.pan,.opn,.clo{color:#440}
.atn{color:#404}
.str,.atv{color:#060}
.kwd,.tag{color:#006;font-weight:700}
}
Bước 2: ACP >> Modules >> HTML & JAVASCRIPT >> Javascript Codes >> Create a new javascript: In the topics
Javascript Code * :
- Code:
function selectCode(a) {
a = $(a).closest(".codebox").find("CODE")[0];
if (window.getSelection) {
var b = window.getSelection();
if (b.setBaseAndExtent) b.setBaseAndExtent(a, 0, a, a.innerText.length - 1);
else {
window.opera && "<BR>" == a.innerHTML.substring(a.innerHTML.length - 4) && (a.innerHTML += " ");
var c = document.createRange();
c.selectNodeContents(a);
b.removeAllRanges();
b.addRange(c)
}
} else document.getSelection ? (b = document.getSelection(), c = document.createRange(), c.selectNodeContents(a), b.removeAllRanges(), b.addRange(c)) : document.selection && (c = document.body.createTextRange(), c.moveToElementText(a), c.select())
}
$(function () {
$(".post code").length && ($(".post code br").replaceWith("\n"),
$(".post code").addClass("prettyprint linenums").parent().prev().attr({
onclick: "selectCode(this)",
title: "Click để chọn toàn bộ code",
style: "cursor:pointer"
}), $.getScript("http://devs.forumvi.com/11727.js", function () {
prettyPrint()
}));
});
Zzbaivong