Al instalar Woocommerce me encontrado que cuando se iba a la pagina de finalizar compra el formulario para rellenar los datos se veía fatal, las casillas eran minúsculas.Un error de estructura y estilos en el Checkout.
Para solucionar el problema de imagen de la pagina de finalizar compra he echo dos cosas.
1. Modificar PHP checkout de Woocommerce
He ido al directorio public_html/wp-content/plugins/woocommerce/templates/checkout y he editado el archivo form-checkout.php
solo he modificado las columnas de los divs que por defecto venían establecidas en col-1 y yo les he dado 12 columnas, col-12.
Esto ha echo que los formularios ya se vieran mucho mejor ocupando una medida apropiada tanto en móvil como en escritorio.
Aun así en las opciones de pago al escoger pago con tarjeta se mostraba mal, solo una pequeña casilla que no cabía ni un numero, para solucionar esto he puesto el inspector de código y he ido deshabilitando estilos hasta que me he topado con display flex, al dehabilitarlo se ha visto todo bien al instante.
2. Modificar estilos formulario Woocommerce
La clase from-row es la que usa el formulario de pago con tarjeta en woocommerce. Aplicando el display flex none no funcionaba así que he utilizado el display inherit y se ha solucionado el problema de estilos del formulario de pago!
Me ha surgido un nuevo problema de formato con el formulario de woocommerce, en esta ocasión con el formulario de login, se ve totalmente destrozado por culpa de la mala estructura que ha heredado de la plantilla que uso en el blog.
He echo exactamente lo mismo que arriba pero sin tocar estilos solo tocando las col a 12 columnas por div.
El archivo que he modificado es este public_html/wp-content/plugins/woocommerce/templates/myaccount/form-login.php
solo lo he cambiado en dos div y ya ha funcionado ok!
El formulario de modificar dirección de woocommerce también daba problemas de estructura, he modificado el archivo /public_html/wp-content/plugins/woocommerce/templates/myaccount/my-address.php
HE encontrado mas errores de estructura y se visualizaba mal la pagina del detalles del pedido al finalizar com pra en woocommerce he modificado el archivo public_html/wp-content/plugins/woocommerce/templates/order/order-details-customer.php solo he cambiado las columnas de 1 a 12 como en los casos anteriores.
He mirado varios tutoriales vídeos etc.. pero no encontrado nadie que hablara de modificar la estructura html dentro del archivo php de las plantillas de woocomerce, lo que no se si esto se modificara al actualizar wocommerce, de ser así rápidamente podre aplicar la solución.