Personalizar a barra de rolagem do Blogger

Olá gente. Outro tutorial, mas desta vez é do blog SSD Layout. Todos os créditos são de lá. Estou apenas reblogando.

E lembrem-se: antes de fazer qualquer alteração no seu HTML faça um backup!

Vocês já repararam na minha barra de rolagem? Se não, olhe para ela. Diferente, né? Quer personalizar? Então clique em leia mais e veja o tutorial.



O resultado será este, mas você poderá alterar as duas cores.

É essa rosa com fundo preto

Vá em Modelo>Editar HTML e procure pela seguinte tag:

]]></b:skin>

E antes desta tag cole o seguinte código:

/*** Rolagem da Vertical da Página ***/
::-webkit-scrollbar-thumb:vertical {
background: #ff0f72; /*Cor da barrinha que se move*/
border: 1px solid #bgh; /*Coloque borda se quiser*/
height:50px;
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
}
/*** Rolagem da Horizontal da Página***/
::-webkit-scrollbar-thumb:horizontal {
background-color:#ff0f72; /*Cor da barrinha que se move*/
border: 1px solid #bgh; /*Coloque borda se quiser*/
height:10px;
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
}
/*** Parte fixa da rolagem (fundo que não se move) ***/
::-webkit-scrollbar {
height:10px;
width:15px; /*Largura da barra de rolagem*/
background: #000000; /*Cor da parte fixa, que fica no mundo*/
border: 1px solid #bgh; /*Coloque borda se quiser*/
}

/***Fim da barra de rolagem***/

Mude o que achar necessário.  Na frente do códio está explicando o que ele faz. Só altere os outros se souber o que está fazendo. Os códigos das cores vocês poderão ver AQUI.

Não esqueçam de deixar suas opiniões.