Responder a: Configuración de Checkout Woocommerce

  • Jefferson Maldonado

    organizador
    15 de octubre de 2025 en 4:22 PM

    ¡Hola, Alberto!

    Esto pasa porque, al no usar el checkout nativo (shortcode/módulo), cuando WooCommerce cambia al endpoint “order-received” (“Información final”) ya no respeta tu maquetación de Divi y pinta su propio contenedor, que queda alineado a la izquierda.

    Tienes dos caminos:

    1) Recomendado (estable)

    Usa el checkout nativo:

    En la página de Checkout coloca el shortcode

    (o el módulo Woo Checkout de Divi si lo tienes).

    • Mantén tus estilos alrededor (sección/fila de Divi).
    • Así Woo aplica el mismo layout también en “order-received” y no se rompe la alineación.

    2) Parche rápido (CSS para centrar la “Gracias”)

    Si quieres conservar tu diseño actual, añade este CSS (en Opciones del tema → CSS personalizado o en tu child theme):

    /* Centrar y limitar ancho del resumen de pedido (página de Gracias) */

    .woocommerce-order,

    .woocommerce-order-received .entry-content,

    .woocommerce-page.woocommerce-order-received .woocommerce {

    max-width: 900px;

    margin: 0 auto;

    }

    .woocommerce-order .woocommerce-order-overview,

    .woocommerce-order .woocommerce-column,

    .woocommerce-order address {

    width: 100%;

    }

    Con eso el bloque de “Información final” (Gracias) quedará centrado y con ancho controlado.

    Saludos.

🧠✨ ¡Nueva sección avanzada disponible en el Mastery de WordPress!
This is default text for notification bar