Ưu điểm: Đơn giản, có liệt kê mấy màu chính hay dùng
Khuyến điểm: Không hiện đại bằng cái này
Demo:
Hướng dẫn cách cài đặt. Lưu ý đọc bài này trước khi làm:
http://diendan.chinhphuc.info/t17555-topic
Bước 1: Vào Modules Javascript codes management Tạo 1 trang mới tên tuỳ ý chọn In all the pages Code sau vào và Save

Code:

$(function() {if (document.getElementById('color')) {var colors=new Array('00','22','44','88','CC','FF');var x='<div id="colorpickers"><table id="colortd">';var y=x;for (i = 5; i >= 0; i--) {x=x+'<tr>';y=y+'<tr>';for (j = 5; j >= 0; j--) {for (k= 5; k >= 0; k--) {var col = colors[j]+colors[i]+colors[k];x=x+'<td style="background: #'+col+';"><button style="background:#'+col+';" title="#'+col+'" onmouseout="this.className=\'\';" onmouseover="this.className=\'selectHover\';" onclick="bbfontstyle(\'[color=#'+col+']\', \'[/color]\');selectWysiwyg(this, \'color\');return false;"></button></td>';y=y+'<td style="background: #'+col+';"><button style="background:#'+col+';" id="text_editor_cmd_constructBBcode_select_color_#'+col+'"></button></td>';}} x=x+'</tr>';y=y+'</tr>';}document.getElementById('color').innerHTML=x+'</table></div>';document.getElementById('wcolor').innerHTML=y+'</table></div>';
};$("#color, #wcolor").css({"overflow":"visible";})
});

Bước 2 (không làm cũng được, chỉ để trang trí cho đẹp thêm ): Vào Display Color CSS Cho dòng css sau vào cuối và Save

Code:


#colorpickers {top: 22px; left: -230pxposition: absolute; ;}
#colortd td {padding: 1px;}
#colortd td button { padding: 0px;height: 15px; width: 15px;border: 1px solid #fff;}
#colortd {border: 1px solid #fff;}
#colortd td button:hover {border: 1px solid #fff;}

Nguồn:http://diendan.chinhphuc.info/t19026-topic#123794