Bạn muốn làm đẹp cho khung code mà mình đang sử dụng trên forumotion giống như cái tui đang dùng thì đùng đoạn code dưới đây mà tui chôm được từ diễn đàn của forumotion và tô màu lại cho nó đẹp hơn.

Vào Javascript codes management và Create new a javascript rồi dán đoạn code dưới vào. Vậy là có một khung code tuyệt vời.

Nếu bạn muốn sửa màu sắc cho phù hợp với forum của mình vào trong code này sửa lại nhé.

Code:

(function() {
   var style = document.createElement("style");
   style.type = "text/css";
   style.innerHTML =
      'code.jsCode_block, pre.jsCode_block {' +
      '  background-color: #FAFAFA !important;' +
      '  border: 1px solid #39C !important;' +
      '  color: #000000;' +
      '  font-family: Consolas,"Bitstream Vera Sans Mono","Andale Mono",Monaco,"DejaVu Sans Mono","Lucida Console",monospace !important;' +
      '  font-size: 11px !important;' +
      '  line-height: 110% !important;' +
      '  margin-top: 0 !important;' +
      '  max-height: 250px !important;' +
      '  overflow: auto !important;' +
      '  padding: 5px !important;' +
      '  white-space: pre-wrap !important;' +
      '  width: auto !important;' +
      '}' +
      '.jsCodetop {' +
      '  background-color: #39C !important;' +
      '  color: #fff;' +
      '  font-size: 14px;' +
      '  font-weight: bold;' +
      '  line-height: 100%;' +
      '  margin-top: 5px;' +
      '  padding: 8px;' +
      '}' +
      '.jsCodetop button {' +
      '  background: -moz-linear-gradient(center top , #EDEDED 5%, #DFDFDF 100%) repeat scroll 0 0 #EDEDED;' +
      '  border: 1px solid #BBBBBB;' +
      '  border-radius: 3px 3px 3px 3px;' +
      '  color: #fff;' +
      '  cursor: pointer;' +
      '  display: inline-block;' +
      '  font-size: 14px;' +
      '  padding: 0 6px;' +
      '  text-decoration: none;' +
      ' float:right;' +
      '  margin: 0 2px;' +
      '}' +
      '.jsCodetop button:hover {' +
      '  background: -moz-linear-gradient(center top , #DFDFDF 5%, #EDEDED 100%) repeat scroll 0 0 #DFDFDF;' +
      '  border-color: #9A9A9A;' +
      '  color: #3D70A3;' +
      '}' +
      '.jsCodetop button:active {' +
      '  position: relative;' +
      '  top: 1px;' +
      '}' +
      'pre.jsCode_block.expand, code.jsCode_block.expand {' +
      '  max-height: 100% !important;' +
      '}' +
      'pre ol.linenums {' +
      '  color: #afafaf;' +
      '  font-size: 12px;' +
      '  list-style: outside none decimal;' +
      '  padding: 5px 0 5px 42px !important;' +
      '  margin: -16px 0 0;' +
      '  width: auto;' +
      '}' +
      'pre ol.linenums li > span {' +
      '  color: #000000;' +
      '}' +
      'pre ol.linenums li {' +
      '  border-left: 3px solid #6ce26c;' +
      '  padding-left: 15px;' +
      '  list-style: inherit;' +
      '  font-size: inherit !important;' +
      '}';
   document.getElementsByTagName("head")[0].appendChild(style);
})();
 
jQuery(function() {
   var tagCode = jQuery('.cont_code, code'),
      codebox = null;
 
   for (var i = 0, len = tagCode.length; i < len; i++) {
      codebox = jQuery(tagCode[i]).closest('.codebox');
      codebox.before(
         '<div class="jsCodetop">Code        <button onclick="jsCodeExpand(this); return false;">expand</button>' +
         '  <button style="display: none; " onclick="jsCodeCollapse(this); return false;">collapse</button>  ' +
         '  <button onclick="jsCodeSelect(this); return false;">select</button>  ' +
         '  <button onclick="jsCodePopup(this); return false;">popup</button>&nbsp; ' +
         /*'  <button style="margin-right: 50px; float: right;" onclick="jsCodeAbout(this); return false;">?</button>' + */
         '</div>' +
         '<pre class="jsCode_block">' +
         '  <ol class="linenums">' + tagCode[i].innerHTML.replace(/<br>/mg, '<li class="L1"><span>') + '</ol>' +
         '</pre>'
      );
      codebox.remove();
   }
});
 
function jsCodeExpand(oThis) {
   jQuery(oThis).css('display', 'none');
   jQuery(oThis).next().css('display', '');
   jQuery(oThis).parent().next('pre.jsCode_block').addClass('expand');
}
 
function jsCodeCollapse(oThis) {
   jQuery(oThis).css('display', 'none');
   jQuery(oThis).prev().css('display', '');
   jQuery(oThis).parent().next('pre.jsCode_block').removeClass('expand');
}
 
function jsCodePopup(oThis) {
   var content = jQuery(oThis).parent().next('pre.jsCode_block').html();
   var my_window = window.open("", "To select the code: [Ctrl] + [A]", "scrollbars=1toolbar=no,menubar=no,personalbar=no,status=0,left=0,location=0,menubar=0,top=0,width=640,height=480");
   my_window.document.write('<pre>' + content + '</pre>');
}
/*
function jsCodeAbout(oThis) {
   alert('Simple code to add line counter fuctionality for Forumotion\n\nBy JScript FROM Brazil - 2015/04/10\n');
}*/
 
function jsCodeSelect(oThis) {
   var doc = document;
   var text = jQuery(oThis).parent().next('pre.jsCode_block')[0];
   if (doc.body.createTextRange) {
      var range = doc.body.createTextRange();
      range.moveToElementText(text);
      range.select();
   } else if (window.getSelection) {
      var selection = window.getSelection();
      var range = doc.createRange();
      range.selectNodeContents(text);
      selection.removeAllRanges();
      selection.addRange(range);
   }
}