|
Add to AdminCP -> Skinning & Styles -> Board Wrappers -> Footers:
| CODE | | <script type="text/javascript"> <!-- var e = document.getElementsByTagName("td"); var x = /\[codebox\](.+?)\[\/codebox\]/gi; for(var n = 0; n < e.length; n ++) { if(!e[n].getElementsByTagName("textarea")[0] && x.test(e[n].innerHTML)) e[n].innerHTML = e[n].innerHTML.replace(x, "<div class='codebox'><div class='codebox-title'>CODEBOX</div><div class='codebox-code'>$1</div></div>"); } // --> </script> |
Add to Admin CP - Skinning & Styles -> Manage Style Sheets:
| CODE | .codebox {
border: 1px solid #CCCCCC;
background-color: #162C3A;
width: 600px;
}
.codebox-title {
border: 1px solid #CCCCCC;
font-weight: bold;
color: #FFFFFF;
padding: 5px 5px 5px 5px;
}
.codebox-code {
background-color: #FFFFFF;
color: #003366;
padding: 5px 5px 5px 5px;
height: 150px;
overflow: scroll;
} |
Description/Usage:
It's for InvisionFree and will let you use [codebox]script[/codebox] when posting large scripts. It adds scroll bars to the codebox. You can change the CSS attributes to whatever you wish. This would be very simple if they would have used divs in the first place and not placed the original code box in a table cell. The reason is you can't set overflow on a tablecell with CSS.
To work around this problem on previously posted huge scripts on your forum, you can add the script below.
Add to AdminCP -> Skinning & Styles -> Board Wrappers -> Javascript:
| CODE | <script type="text/javascript">
<!--
function addCodebox() {
var el = document.getElementsByTagName('td');
for(i=0;i<el.length;i++){
if(el[i].id=="CODE") {
var newDiv = document.createElement('div');
newDiv.setAttribute('id', 'codebox');
var markup = el[i].innerHTML;
el[i].innerHTML = "";
el[i].appendChild(newDiv);
newDiv.innerHTML = markup;
}
}
}
function addEvent(obj, evType, fn){
if (obj.addEventListener){
obj.addEventListener(evType, fn, true);
return true;
} else if (obj.attachEvent){
var r = obj.attachEvent("on"+evType, fn);
return r;
} else {
return false;
}
}
addEvent(window, 'load', addCodebox);
//-->
</script> |
Add to Admin CP - Skinning & Styles -> Manage Style Sheets:
| CODE | #codebox {
border: 1px solid #003366;
color: #003366;
height: 150px;
width: 610px;
overflow: scroll;
} |
Description/Usage:
It redisplays the original code boxes on the page by wrapping the contents in a div so you can format it via CSS, thus adding the scrollbars. Again you can change the CSS attributes to whatever you want to match your board. However, don't remove the "overflow: scroll;" on any of them or it negates the whole point.
|