Cómo Personalizar la Barra de Scroll de tu Página Web en WordPress

Опубликовано: 22 Май 2026
на канале: BigMasterWeb
788
11

En este tutorial aprenderás a personalizar la barra de scroll de tu página web en WordPress. Con solo copiar y pegar un código proporcionado en la descripción, podrás modificar completamente el aspecto de la barra de scroll.

Plugins Premium (Descuento): https://bit.ly/3ZrtKYU

Durante el tutorial, se te guiará paso a paso para agregar el código CSS adicional que transformará la apariencia de la barra de scroll. Aprenderás a personalizar su color, ajustar el ancho y cambiar el fondo según tus preferencias.

Además, se te mostrará cómo modificar el comportamiento de la barra al pasar el cursor sobre ella. Podrás elegir entre mantener un color constante o seleccionar uno diferente al interactuar con la barra de scroll.

No te preocupes si no tienes experiencia en codificación, el tutorial es fácil de seguir y se te proporcionará un enlace en la descripción del video para generar códigos de color. También se mencionará cómo convertir la barra en un borde cuadrado o redondo, según tu gusto.

Página para código de color
https://htmlcolorcodes.com/es/

Código CSS
body {
background-size: 100vh;
overflow: overlay;
}

body::-webkit-scrollbar {
width: 10px;
background: transparent;
}

body::-webkit-scrollbar-thumb {
background: #E73426;
border-radius: 20px;
border-right: 5px;
}

body::-webkit-scrollbar-thumb:hover{
background-color: #E73426;
}

html{
scrollbar-width: thin;
scrollbar-color: #E73426 #fff;
}