Responder a: Texto en viñeta Flip Card Divi Pixel

  • Jefferson Maldonado

    organizador
    21 de agosto de 2024 en 3:33 PM

    Hola Alberto,

    ¡Gracias por tu mensaje! Entiendo que deseas agregar una lista con viñetas en la parte posterior de una Flip Card en Divi Pixel, pero el módulo no tiene un editor de texto completo para esto. Puedes lograrlo utilizando un poco de CSS personalizado. Aquí te explico cómo hacerlo.

    Solución con CSS

    Abre la página donde estás creando la Flip Card con el Constructor Divi. Selecciona el módulo de Flip Card y ve a la configuración de la parte posterior de la tarjeta (Back).

    Añadir el Contenido HTML:

    Aunque el módulo no tiene un editor de texto completo, puedes usar el campo de contenido personalizado o HTML para agregar el código de una lista.

    Inserta el siguiente código HTML en el campo de contenido de la parte posterior de la Flip Card:

    <ul class="flip-card-bullets">

    <li>Punto 1</li>

    <li>Punto 2</li>

    <li>Punto 3</li>

    </ul>

    Añadir el CSS Personalizado:

    Ve a Divi > Opciones del tema > CSS personalizado o utiliza la opción de CSS personalizado dentro de la configuración del módulo si está disponible.

    Añade el siguiente código CSS para estilizar la lista con viñetas:

    .flip-card-bullets {

    list-style-type: disc; /* Esto crea las viñetas */

    padding-left: 20px; /* Espaciado para alinear el texto con las viñetas */

    margin: 10px 0;

    }

    .flip-card-bullets li {

    margin-bottom: 10px; /* Espaciado entre los elementos de la lista */

    font-size: 16px; /* Ajusta el tamaño de la fuente si es necesario */

    color: #333; /* Color del texto */

    }

    Con estos pasos, podrás agregar una lista de viñetas en la parte posterior de la Flip Card usando HTML y CSS personalizados. Esta solución te permitirá tener el control del diseño de las viñetas, y puedes ajustarla según las necesidades de tu proyecto.

    Espero que esta guía te sea útil. Si tienes alguna otra pregunta o necesitas más asistencia, no dudes en contactarme.

    Saludos, Jefferson 😊🖐