Blogging Tips & Tricks

Customize SCM Music Player Skins

#player,#player a{ color:#fff;  font-size: 11px; font-family: verdana;}

#player{ background:url(INSERT BACKGROUND URL HERE); background-position:bottom; background-color: #00000;}

#player .mainImage{ background:url(INSERT IMAGE URL HERE); }

#player #baseLeft{ width:93px; }

#player #baseRight{ width:145px;}

#player .button{  width:26px; }

#player #play{ background:url(); } 

#player #play,#player #pause{ left:26px; } 

#player #previous{ left:0px; }

#player #next{ left:52px; }

#player #title{ left:90px;  font-size: 9px; }   

#player #tooltip{ right:196px; }

#player #timer{ right:120px;  }

#player #list{ right:0px; }

#player #seeker{ right:320px; }

#player #seekerBase{ border-color:#fff;  }   

#player #seekerBuffered{ background-color:#fff; }

#player #seekerSliderBase{ background-color:#000000; } 

#player #volume{ width:65px; right:39px; }

#player #volumeSlider{ width:8px; background:url(INSERT VOLUME BACKGROUND URL HERE); }

#playlist,#playlist .module,#playlist h3{ border-color:#000000;}

#playlist .module{  color:#CFCFCF; background-color:#000000; }

#playlist h3{ background:url(INSERT BACKGROUND URL HERE); color:#CFCFCF; background-color:#000000;  }

#playlist .even{background-color:#000;}

#playlist .odd{ background-color:#000;}

#playlist .focus{ background-color:#000; color:#aaa;}         

Skin feita por: pensamentos-antigos, NÃO PLAGIE.     

Making Custom Backgrounds

First thing you want to do is to get yourself a software that lets you edit pictures (e.g. photoshop). But if you don't want to, use pixlr, a free picture editing site online.

First, you want to make a background that's 1800 wide and 1600 high pixels.

Then, you want to make sure the inner area of your blog (the area where all the text and more will go) is at least _______ pixels.

Then, go to photobucket or any site that makes your pictures into URLS, and copy the URL.

After, paste that URL in the 'INSERT URL HERE' section of the html below

<br /><br /><style type="text/css">body {background-image:url("INSERT URL HERE"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style>

Once your done that, go to layout, and select Html/Javascript as a gadget.

Paste the code and save it.

Now you'll have an amazingly unique custom background!

*****WILL UPDATE WITH PICTURES AND COMPLETE*****