• iborra
    borde slide
    DESCUBRE A TRAVÉS DE
    borde slide
    NUESTRO BLOG
    Artículos de interés sobre diseño web

Cómo incluir el campo NIF/DNI/NIE del cliente y generar facturas y albaranes en PDF en Woocommerce

woocommerce

Ciertos países obligan en su legislación a incluir de forma obligatoria el campo DNI/NIE, para personas físicas, o el NIF, para empresas. Este campo debe ser proporcionado por el cliente antes de finalizar la compra de un producto para poder ser incluido en la factura posterior. Nos encontramos que Woocommerce no nos proporciona ni una cosa ni otra, así que en este tutorial, algo largo, incluiremos este campo en el checkout y generaremos facturas en PDF con este campo incluido.

Sin más rodeos, vamos a empezar a incluir el campo NIF/DNI/NIE en el checkout de nuestra tienda de Woocommerce. Lo más fácil sería incluir el campo a través de un plugin pero cargaríamos mucho más la web de forma innecesaria. Así que lo que haremos será incluir un código en nuestro archivo functions.php. No es tan complicado y la manera de hacerlo es la siguiente (es importante hacer una copia de seguridad antes de modificar el archivo):

  1. Nos dirigimos a la columna de la izquierda de nuestra administración de Wordpress y le damos a Apariencia–>Editor, y buscamos en la columna de la derecha el archivo functions.php y hacemos clic. Puede aparecer en gris y entre paréntesis. Otra forma de hacerlo, como en mi caso, nos dirigimos a la carpeta de Wamp en el disco duro y en la carpeta donde tenemos instalado nuestro Wordpress nos dirigimos a wp-content–>themes–>tu tema–>functions.php, y lo abrimos con un editor de texto, por ejemplo, con Dreamweaver.
  2. Dentro del archivo functions.php, copiamos y pegamos el siguiente código dentro de la etiqueta php.
  3. /*** Añade el campo NIF a la página de checkout de WooCommerce ***/
    add_action( 'woocommerce_after_order_notes', 'agrega_mi_campo_personalizado' );
     
    function agrega_mi_campo_personalizado( $checkout ) {
     
        echo '<div id="additional_checkout_field"><h2>' . __('Información adicional') . '</h2>';
     
        woocommerce_form_field( 'nif', array(
            'type'          => 'text',
            'class'         => array('my-field-class form-row-wide'),
            'label'         => __('NIF/DNI/NIE'),
            'required'      => true,
            'placeholder'   => __('Introduce el Nº NIF o DNI o NIE'),
            ), $checkout->get_value( 'nif' ));
     
        echo '</div>';
     
    }
    
    /*** Comprueba que el campo NIF no esté vacío ***/
    add_action('woocommerce_checkout_process', 'comprobar_campo_nif');
     
    function comprobar_campo_nif() {
       
        // Comprueba si se ha introducido un valor y si está vacío se muestra un error.
        if ( ! $_POST['nif'] )
            wc_add_notice( __( 'NIF/DNI/NIE, es un campo requerido.' ), 'error' );
    }
    
    /*** Actualiza la información del pedido con el nuevo campo ***/
    add_action( 'woocommerce_checkout_update_order_meta', 'actualizar_info_pedido_con_nuevo_campo' );
     
    function actualizar_info_pedido_con_nuevo_campo( $order_id ) {
        if ( ! empty( $_POST['nif'] ) ) {
            update_post_meta( $order_id, 'NIF', sanitize_text_field( $_POST['nif'] ) );
        }
    } 
    
    /*** Muestra el valor del nuevo campo NIF en la página de edición del pedido ***/
    add_action( 'woocommerce_admin_order_data_after_billing_address', 'mostrar_campo_personalizado_en_admin_pedido', 10, 1 );
     
    function mostrar_campo_personalizado_en_admin_pedido($order){
        echo '<p><strong>'.__('NIF').':</strong> ' . get_post_meta( $order->id, 'NIF', true ) . '</p>';
    } 
    
    /*** Incluye el campo NIF en el email de notificación del cliente ***/
     
    add_filter('woocommerce_email_order_meta_keys', 'muestra_campo_personalizado_email');
     
    function muestra_campo_personalizado_email( $keys ) {
        $keys[] = 'NIF';
        return $keys;
    }
    
  4. Una vez copiado y pegado le damos a Actualizar Archivo. En la administración de Wordpress solo podrás actualizar el archivo si tienes activado el modo escritura de functions.php (se activa desde el cPanel de tu hosting contratado). Si lo hacemos por Dreamweaver solo tendremos que guardar y subir el archivo al servidor.

Con estos sencillos 3 pasos tendremos el campo NIF/DNI/NIE para que el cliente lo rellene. El campo es obligatorio rellenarlo, si queréis que no lo sea cambiar donde dice 'required' => true, por 'required' => false.

Recordar que este campo solo aparece en el checkout, mientras se tramita la compra del producto. Sería bueno avisar al cliente en alguna parte de su cuenta (cuando se registra), que tal campo lo rellenará más tarde. Este es el resultado del campo puesto en el checkout.

Sabiendo un mínimo de programación, viendo el código anterior, os será muy sencillo de modificar a vuestro gusto. Si alguna vez se debe modificar este campo de forma manual porque el cliente se equivocó a la hora de escribirlo o por otra causa, accedemos desde la administración de Wordpress y en la columna de la izquierda vamos a Woocommerce–>Pedidos. Una vez dentro le damos a ver el pedido para editarlo, nos mandara a otra página donde un poco más abajo encontraremos donde modificar el número donde pone valor y luego actualizarlo.

Woocommerce no da la posibilidad de imprimir facturas o albaranes y así poder enviarselas al cliente. Pero existe un plugin llamado WooCommerce PDF Invoices & Packing Slips, que nos ayudará a generar facturas y albaranes en PDF de forma rápida y sencilla. Antes de explicar este plugin, es necesario incluir unas líneas de código que hará que el campo NIF/DNI/NIE del cliente aparezca en la factura que le vamos a enviar por email o bien desde su cuenta creada. Estas líneas de código solo es necesario si vais a utilizar este plugin. Nos vamos al archivo functions.php y copiamos y pegamos el siguiente código justo debajo de lo anterior que pusimos.

/*** Incluir NIF en la factura ***/
 
add_filter( 'wpo_wcpdf_billing_address', 'incluir_nif_en_factura' );
 
function incluir_nif_en_factura( $address ){
  global $wpo_wcpdf;
 
  echo $address . '<p>';
  $wpo_wcpdf->custom_field( 'NIF', 'NIF/DNI/NIE: ' );
  echo '</p>';
}

Ahora vamos a explicar como instalar y configurar este plugin que nos va a venir genial:

  1. Primero nos vamos al siguiente enlace para descargar el plugin en su página oficial WooCommerce PDF Invoices & Packing Slips.
  2. Una vez descargado, instalamos el plugin desde el panel de configuración de plugins de Wordpress o bien pasamos la carpeta descargada a Wamp en la carpeta de plugins y lo subimos a nuestro servidor.
  3. Después de activar el plugin, nos dirigimos a la columna de la izquierda de nuestra administración de Wordpress siguiendo la ruta Woocommerce–>Facturas PDF.
  4. En la pestaña General, dejamos todo marcado como en la imagen que muestro a continuación.
  5. En la pestaña Plantilla, completamos todo aquello que deseemos, os dejo un ejemplo orientativo.
  6. En la pestaña Estado, donde dice System Configuration, observamos que sale un aviso en color rojo que nos está diciendo que la memoria límite del servidor PHP para Wordpress es de 40M y es recomendable que sea de 128. La solución es bien sencilla, solo tenéis que seguir el siguiente tutorial Aumentar la memoria límite del servidor PHP para Wordpress.
  7. Le damos a Guardar cambios, recordar hacerlo en cada pestaña cuando cambiemos algo.
  8. Si nos vamos a la columna de la izquierda de nuestra administración de Wordpress siguiendo la ruta Woocommerce–>Pedidos, veremos que a la derecha de un pedido cualquiera aparece la factura o albaran que enviaremos a nuestro cliente o bien a través de un email o a través de su cuenta registrada.

Ya lo tenemos todo hecho! Ya podemos emitir facturas en PDF con el campo NIF/DNI/NIE cumpliendo con la legislación fiscal de muchos países.

Comenta y comparte este post!

¿Tienes alguna sugerencia, idea, consejo, duda, pregunta, agradecimiento, encuentras algún error o este post no está actualizado? Entonces esperamos tu comentario.

También puedes recomendar y compartir este post. Estamos muy agradecidos por tu apoyo!

Comentarios (8)

  • foto
    Paco Responder

    Hola Iborra: Me voy a permitir una licencia a la que no suelo nunca pero es que fastidia bastante cuando ocurre. Rellenas todos los campos, escribes el mensaje y de repente te equivocas al poner el captcha y... VAYA! se borran todos los campos. Incluso el largo mensaje que he escrito y que voy a tener que volver a escribir. No estaría mal que modificara esa posibilidad. Fastidia bastante tener que volver a escribir todo por un error tonto. Ahora voy a ser prudente y voy a copiar este mensaje por si de nuevo me equivoco. Disculpa pero mosquea mucho perder el tiempo. Un saludo.

    20 de Mayo 2016 a las 20:24h
    • foto blog
      Paco (Iborra Web Design) Responder

      Hola Paco,

      Lo primero, siento mucho las molestias ocasionadas. Sinceramente no pensé en esa posibilidad, que los campos del formulario se borran si uno se equivoca en el captcha. Te pido perdón porque sé que fastidia mucho escribir un texto largo y que luego se borre y tener que volver a empezar.

      Te informo que ya lo hemos solucionado para que no vuelva a pasar.

      Agradezco tu comentario para que podamos seguir mejorando. Aprovecharemos para realizar un tutorial de esto para que más gente lo sepa solucionar. Nos puedes seguir comentando cuando creas conveniente.

      Recibe un cordial saludo.

      23 de Mayo 2016 a las 14:12h
    • foto
      Paco Responder

      Hola Iborra: Es un placer primero que todo tratar con personas tan atentas y afables como tú. El motivo de mi consulta es felicitarte por tu post que he seguido al pie de la letra y me parece perfecto.

      La cuestión es que no tengo todavía terminada la web (no he fabricado aun los productos y por tanto no existen imágenes) y no tengo precios de los productos por lo que simular una compra para ver los resultados se me hace imposible. Solo me gustaría preguntarte si hay alguna posibilidad de ver el resultado final de la factura para, incluso, poder hacer modificaciones en su diseño si no cumple las espectativas de lo que voy buscando.

      He tratado de ser excueto en la pregunta porque el otro día me enrollé de lo lindo y cuando me equivoqué introduciendo el catchap y se borró todo, me agarré un rebote de aupa. Disculpas sinceras. Como indicas ya lo has solucionado de lo cual me alegro un montón. Un cordial saludo y gracias por tu tiempo y atención.

      25 de Mayo 2016 a las 12:30h
    • foto blog
      Paco (Iborra Web Design) Responder

      Gracias por tus palabras Paco.

      Sobre tu pregunta, lógicamente si no hay un pedido realizado la factura no se genera. Lo que puedes hacer es, ir a la administración y entrar en la sección de pedidos que está dentro de Woocommerce. Arriba tienes la opción de añadir un pedido, inventate los datos y algún artículo previamente añadido para que la factura muestre el máximo de datos. Cuando añadas un pedido, a la derecha podrás ver el icono de ver factura PDF. Pon el pedido añadido como completado para que genere la factura.

      Para realizar modificaciones a la factura, entra en la sección facturas PDF que está dentro de Woocommerce y en la pestaña que dice plantilla podrás cambiar lo básico. En la carpeta del plugin tienes los estilos de la plantilla PDF, sigue esta ruta wp-content/plugins/woocommerce-pdf-invoices-packing-slips/templates/pdf/Simple y modifica el archivo css para dejarlo a tu gusto. Todo cambio que hagas lo verás reflejado al actualizar la factura del pedido que generastes anteriormente.

      Estos archivos los puedes reubicar luego en la carpeta de tu tema, en la pestaña de plantilla, donde dice elige una plantilla, te dice cómo hacerlo.

      Espero que te haya podido servir de ayuda. Suerte con la web!

      Un saludo.

      25 de Mayo 2016 a las 15:20h
    • foto
      Paco Responder

      Hola Paco Iborra: Me ha servido y mucho. Era precisamente esa la forma de hacerlo. Más que PERFECTO... PLUSCUANPERFECTO.

      Ya seguí el post de copiar los archivos del plugin en mi tema y prácticamente no tengo que tocar nada pues el resultado es bastante satisfactorio pero se me plantea una duda: ¿aun retocando el css en la carpeta "Simple" del plugin, no tengo que copiar de nuevo ese css retocado en la carpeta creada en el tema para que no difieran y sean el mismo archivo en ambos sitios? Por lo demás millones de gracias y un cordial saludo. Así da gusto.

      25 de Mayo 2016 a las 20:26h
    • foto blog
      Paco (Iborra Web Design) Responder

      Genial! me alegro que te sirva.

      Por lo que preguntas, lo mejor es borrar la carpeta Simple del plugin, ya que este plugin lo actualizarás en un futuro y perderás los cambios que hayas realizado, si quieres también lo puedes dejar. Te recomiendo copiar los archivos en la ruta que dicen (en el tema principal o tema child que es más recomendable por futuras actualizaciones) y por ejemplo cambia de nombre la carpeta Simple por Factura y luego en la administración, en la pestaña Pantalla, selecciona la carpeta Factura para que pille los archivos de ahí.

      Un saludo.

      26 de Mayo 2016 a las 11:12h
  • foto
    Manolo Responder

    He hecho todo lo que comentáis para que aparezca el CIF del cliente en la factura, pero no hay forma. Cuando el cliente rellena los datos si aparece que introduzca el CIF. En mi caso he puesto que sea obligatorio. Pero cuando doy a imprimir la factura no me aparece el CIF. No se que es lo que hago mal. He metido el codigo al final del php en Funciones del tema (functions.php). Gracias de antemano.

    04 de Diciembre 2016 a las 20:44h
    • foto blog
      Paco (Iborra Web Design) Responder

      Hola Manolo,

      ¿Has puesto todo el código que aparece en este artículo dentro de la etiqueta php del archivo functions.php? Por ejemplo, <?php (código de todas las funciones) ?>. Supongo que, lógicamente, también habrás instalado el plugin y configurado la plantilla de factura.

      Un saludo.

      05 de Diciembre 2016 a las 12:11h

Deja un comentario

Este blog se nutre de los comentarios de los visitantes! Así que vamos, únete a nosotros!

Por favor esperamos que entiendas que se eliminarán aquellos comentarios que no tengan nada que ver con el contenido de este post o siempre que se utilicen palabras ofensivas.

COMENTARIO PARA ESTE POST

Imagen mínimo: 300x300 - Formato: jpg o png - Tamaño máximo: 10Mb

CAPTCHA code