Tutorial Divi: Convertir cualquier enlace en un botón de Divi

Uno de los elementos que creo más gustan a todo usuario de Divi, y a los visitantes de las webs creadas con Divi, son los botones animados de acción, son limpios, claros y bien diseñados, y de verdad incitan a la acción, que es lo que deben hacer.

Es por ello que cualquier usuario de Divi en alguna ocasión ha pensado eso de “¿Cómo pondría yo un botón de estos en una página normal que no esté maquetada con Divi?

Y sí, si tienes Divi, o el constructor Divi, instalado, puedes convertir cualquier enlace de una entrada o página en un bonito botón estilo Divi.

Vamos a ver los 2 pasos requeridos.

Tienes que tener Divi instalado

Vaya por delante dejar claro que este tutorial es para usar los botones animados de Divi en cualquier parte, pero que tengas claro que Divi tiene que estar instalado, el tema o el plugin, por poco que lo uses.

Un poquito de CSS por favor

En este ejemplo daremos un poco de estilo a un botón animado estilo Divi con el texto y borde en rojo, y fondo transparente (lo siento, me pirran los fondos transparentes).

Lógicamente, adapta los colores y demás a tu diseño como gustes.

En el mismo código te señalo dónde cambiar los colorines.

Simplemente añade el código en tu administración de WordPress > Apariencia > Personalizar > CSS adicional. Publica los cambios, no se te olvide.

Crea el enlace con “clase”

Ya solo nos queda añadir algo de “clase” a tu enlace, para que luego se convierta en un botón.

Para ello, en tu entrada o página, añade el enlace que quieras.

Si pasas a la pestaña HTML del editor verás el enlace generado.

Pues bien, lo único que nos queda por hacer es aplicarle al enlace la clase que creamos anteriormente. Puedes hacerlo manualmente editando el enlace, para añadir lo siguiente:

Con lo que quedaría así:

¡Y ya está!

Ahora tu enlace se verá mucho más mono, como cualquier botón de Divi pero con tus colores personalizados.

Enlace como botón Divi (inactivo)

Enlace como botón Divi (hover)

Valora este artículo para mejorar la calidad del blog ...

FlojitoNo está malEstá bienMe ha servidoFantástico (2 votos, promedio: 5,00 de 5)
Cargando…

Autor: Fernando

Fernando Tellado, apasionado de WordPress, profesor, consultor y ponente. Maquero cansino, padre de tres hijos y de una perrita Beagle, Bilbaíno de nacimiento, Español de corazón y ciudadano de donde me quieran. Autor del libro WordPress - La tela de la araña. Mi blog personal es Navegando con red, donde he crecido como escritor en la red y ofrezco mis visiones acerca de la Web 2.0 y la blogosfera.

Comparte esta entrada en
468 ad

Al dejar un comentario se solicitan datos como tu correo y nombre que se almacenan en una cookie para que no tengas que volver a completarlos en próximas visitas. Para enviar un comentario debes aceptar nuestra política de privacidad y la del servicio externo Disqus que las gestiona y almacena.

Pin It on Pinterest