Ahorra hasta 20% OFF en nuestro Planes y Cursos

Día(s)

:

Hora(s)

:

Minuto(s)

:

Segundo(s)

Solo durante:

Ahorra hasta 20% OFF en nuestro Planes y Cursos

Seleccionar página
4
Volver al contenido del HUB: Hub | Snippets Footer

Divi Snippet: Personalizar el botón «Ir Arriba» en Divi

En este HUB Content te daremos el snippet para cambiar el color y personalizar el Botón «Ir Arriba» en Divi. Puedes aplicarlo en cualquier sitio web y personalizar el código CSS tanto como quieras.

Si quieres personalizar Divi en toneladas industriales tenemos el curso de Divi Toolbox, un plugin que te ayuda a sacarle todo el provecho a Divi con sus múltiples configuraciones ¡No te lo pierdas!

Este es un snippet de Divi super sencillo con el que podrás cambiar no solo el color, sino los estilos en general del botón «ir arriba» que viene por defecto con Divi. Sobre todo te sirve para poder darle un estilo muy particular al que viene por defecto con Divi.

Snippet de CSS para personalizar el botón «Ir Arriba» en Divi

Copia el código CSS de acá abajo y luego de eso, ve a las opciones del tema Divi > Generales > insertar código CSS personalizado y pega el código CSS.

/*color boton ir arriba*/
.et_pb_scroll_top.et-pb-icon {
	color: #ffffff; /*color de la flecha*/
	background: #ff6600; /*color del fondo*/
	border-radius: 100px; /*radio del icono*/
	font-size: 15px; /*tamaño del icono*/
}

A partir de aquí, puedes cambiar los valores de color, fondo, radio del borde y tamaño de la fuente del ícono.

De esa manera podrás darles unos estilos personalizados al botón «Ir arriba» en Divi. Hazle juego con tus colores corporativos y dale un aspecto interesante.

El resultado que tendremos será el siguiente:

Cambiar el Color del Botón "Ir Arriba" en Divi


¡Y listo! Super fácil, ¿verdad? ¡Ahora con este snippet podrás cambiar los estilos del botón «ir arriba» en Divi!

¿Te ha gustado? No olvides compartirlo y comentar nuestro contenido. Nos vemos en un próximo Snippet.

Contenido Relacionado

3 Comentarios

  1. Piero Roque

    Hola amigo! trato de copiar el código a Opciones del Tema > General > CSS personalizado y al guardar cambios, entro a mi página pues no me apareció el botón, sabes el porque? :C Muchas gracias.

    Responder

Enviar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

¡40% + 10% OFF en nuestro lanzamiento!

Apúntate y te avisaremos cuando esté publicada nuestra nueva plataforma uxdivitemplates.com. Te regalaremos un cupón ÚNICO de descuento del 10% adicional a los descuentos de lanzamiento.

¡Gracias! Te avisaremos cuando publiquemos nuestra plataforma y te enviaremos el cupón de descuento único por estar en esta lista.