Oferta SiteGround Black Friday

Tutorial Divi: Llamada a la acción en una sola línea

El módulo de llamada a la acción de Divi tiene por defecto dos líneas, una para los textos y otra para el botón de acción, pero  puedes fácilmente cambiarlo para que esté todo en una sola línea.

El modo de conseguirlo es bien sencillo. Solo tienes que ir al Personalizador y en la sección CSS adicional añadir el siguiente código:

/* CTA Divi en una línea */
@media only screen and ( min-width: 1100px ) { 
a.et_pb_promo_button.et_pb_button{
float: right;
clear:both;
margin-top:-7%!important; /* cambiar a lo que necesites o quede bien */
}
 
.et_pb_promo_description {
width: 75% /* cambiar a lo que necesites o quede bien */
float:left;
clear:right;
}
}

Hay dos líneas del código que deberás adaptar a tu gusto, la del margen superior del botón (margin-top) y la del ancho de los elementos (width), como indico en el código.

Guardas los cambios y, personalizaciones propias aparte, pasarás de esto…

A esto otro…

¿De cuánta utilidad te ha parecido este contenido?

¡Haz clic en los emoticonos para valorarlo!

Promedio de puntuación 5 / 5. Total de votos: 4

Hasta ahora ¡no hay votos!. Sé el primero en valorar este contenido.

Ya que has encontrado útil este contenido...

¡Sígueme en las redes sociales!

¡Siento que este contenido no te haya sido útil!

¡Ayúdame a mejorar este contenido!

Por favor, dime, ¿cómo puedo mejorarlo?

¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!

AVISO: Esta publicación es de hace 3 años o más. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado. ¡Ah! ¿te funciona? pues entonces no he dicho nada :)

Sobre el autor

1 comentario en “Tutorial Divi: Llamada a la acción en una sola línea”

  1. Genial Fernando! Estuve quebrándome la cabeza con esta hace un par de meses y esta solución es mas simple y de mejor resultado. Gracias!

    Por cierto: creo que al código le falta el !important; detras del 75% de la linea 10

Deja un comentario

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

Información base sobre privacidad:
- Responsable: Fernando Tellado ([email protected])
- Fin del tratamiento: Moderación de comentarios para evitar spam
- Legitimación: Tu consentimiento
- Comunicación de los datos: No se comunicarán los datos a terceros salvo por obligación legal
- Derechos: Acceso, rectificación, portabilidad, olvido

 

Scroll al inicio