Different Styles For Different Skins

[»Prodigy™]

Many people want to have different styles on their boards for different skins. Things like gradients, extra text colors, and anything else done using CSS can be set to work for each different skin with this code.

Place in Global Headers

<script type="text/javascript">
<!--

/* Different Styles for Different Skins */

//Edit styles here

var styleskin1='Line 1'+
'Line 2'+
'Line 3'+
'Line 4';

var styleskin2='Line 1'+
'Line 2'+
'Line 3'+
'Line 4';

var styleskin3='Line 1'+
'Line 2'+
'Line 3'+
'Line 4';

//Do not edit

var styles=new Array(); styles[0]='';

//Edit number of skins here

styles[1]=styleskin1;
styles[2]=styleskin2;
styles[3]=styleskin3;

//Do not edit below

document.write('<style type="text/css"><!-- '+styles[pb_skinid]+'// --></style>');

// -->
</script>


I'll break down the editable parts below for anybody that isn't fluent in javascript.


var styleskin1='Line 1'+
'Line 2'+
'Line 3'+
'Line 4';


Here is where you edit the actual CSS attributes. In each line put "body { background-color: #999999; }" or whatever else you want in your style. Make sure you leave the single quotes and plus signs in there, as well as the semicolon at the end, it won't work without them.


styles[1]=styleskin1;
styles[2]=styleskin2;
styles[3]=styleskin3;


This is the list of skins in your board. If you want to find the order, go edit your profile, and look at the order they appear in the dropdown. The first one is 1, second 2, and so on. The number of fields should match the number of skins you have, and each field should have a corresponding "styleskin#" entry above.

For any code support, please post your board URL with your question in the support board, so that it is possible to check your headers.