Barra de rolagem personalizada/2 formas

Oi pessoal hoje vou ensiná-los a personalizar a barra de rolagem com tutoriais que aprendi no Girls Online e no Cute World.Vamos lá?

Primeiro a redonda:

1)Vá em modelo>editar html>expandir modelos de widget >procure por]]></b:skin>

2)Acima de ]]></b:skin> cole o código abaixo:

::-webkit-scrollbar-thumb:vertical {
background: #FF69B4;
height:50px;
border: 2px solid #FFFFFF;
box-shadow: 2px 2px 4px #bebdbd;
-moz-box-shadow: 2px 2px 4px #bebdbd;
-webkit-box-shadow: 2px 2px 4px #bebdbd;
-khtml-box-shadow: 2px 2px 4px #bebdbd;
-moz-border-radius: 10px; /* Para Firefox */
-webkit-border-radius: 10px; /*Para Safari e Chrome */
border-radius: 10px; /* Para Opera 10.5+*/
}
::-webkit-scrollbar-thumb:horizontal {
background-color:#f26d92; height:10px;
border: 1px dashed #fff;
-webkit-box-shadow:0 0 1em #eee; }
::-webkit-scrollbar {height:10px; width:20px; background: url(URL DO BACKGROUND FIXO) repeat;
box-shadow: -3px -2px 10px #bebdbd;
-moz-box-shadow: -3px -2px 10px #bebdbd;
-webkit-box-shadow: -3px -2px 10px #bebdbd;
-khtml-box-shadow: -3px -2px 10px #bebdbd;}
}

O que você deve modificar: #FF69B4 pela cor da barrinha que rola;#FFFFFF pela borda da barrinha que rola;URL DO BACKGROUND FIXO pelo url da parte fixa.

Agora a retangular:
)Vá em modelo>editar html>expandir modelos de widget >procure por ]]></b:skin>
2)Acima de ]]></b:skin> cole o código abaixo:

{scrollbar-face-color:#9B30FF;scrollbar-highlight-color:#9B30FF;scrollbar-3dlight-color:#000000;scrollbar-darkshadow-color:#000000;scrollbar-shadow-color:#9B30FF;scrollbar-arrow-color:#000000;scrollbar-track-color:#000000;}::-webkit-scrollbar {width: 12px; height: 4px; background: #000000; }::-webkit-scrollbar-thumb { background: #9B30FF; }

Entedendo:
Barra de rolagem: #9B30FF
Plano de fundo: #000000