Olá bloggers e leitores!
Hoje trarei um tutorial simples, fácil de instalar e que você pode personalizar a barra de rolagem do seu blog deixando-a ao seu gosto.
Agora tem um probleminha é que a barra de rolagem personalizada só será visível para quem estiver navegando no Chrome ou Safari. Mas vale a pena personalizá-la, pois a maioria dos navegantes hoje em dia utilizam o Chrome.
Bom, então vamos agora aprender como personalizar a barra de rolagem do seu blog:
Primeiro vá ao Painel de seu blog clique na aba Modelo e a seguir clique em Editar HTML.
Dentro da caixa de código html dê um Ctrl+F para aparecer a caixa de busca e nela digite ]]></b:skin> e tecle Enter para localizar.
e acima do código encontrado cole este código:
/* --------- BARRA DE ROLAGEM PERSONALIZADA ----------- */Salve e visualize, se tiver tudo ok. Parabéns!
/*** Rolagem da Vertical da Página ***/
::-webkit-scrollbar-thumb:vertical {
background: #000000; /*Cor da barrinha que se move*/
height:50px;
}
/*** Rolagem da Horizontal da Página***/
::-webkit-scrollbar-thumb:horizontal {
background-color:#000000; /*Cor da barrinha que se move*/
height:10px;
}
/*** Parte fixa da rolagem (fundo que não se move) ***/
::-webkit-scrollbar {
height:10px;
width:15px; /*Largura da barra de rolagem*/
background: #ca1700; /*Cor da parte fixa, que fica no fundo*/
}
Nota: Se você tiver um pouco de conhecimento em CSS você ainda pode personalizar a barra de rolagem conforme as cores do seu blog.
0 Comentários