¿Cómo Generar PDF Dinámico en WordPress?

El generar un PDF puede resultar una difícil tarea si no se cuenta con la orientación adecuada para esto. Pero tranquil@, en este post te mostrare un ejemplo practico con el cual podrás generar un Reporte de Notas en PDF y una Constancia Académica desde Wordrpess de manera dinámica. Digo generar PDF dinámico en WordPress, ya que estaremos obteniendo datos almacenados en el sitio web, donde podremos obtener incluso el nombre y apellido de un usuario en particular, y generar un PDF listo para descargar o imprimir.

Antecedente

Con anterioridad ya había trabajado en un reporte mucho mas complejo que el par de ejemplos que mostrare en este post, sin embargo, mi parte del trabajo llegaba hasta el procesos de guardar y obtener los datos a mostrar en dicho reporte, la generación del PDF se encargo alguien mas, pero viendo el código realmente la diferencia es notable, y mas adelante mostrare el por que de esto. Recientemente tuve que generar PDF dinámico en Wordpres, junto a LearnDash, donde se selecciona el usuario a generar dicho historial académico, y obtiene las notas de un modulo de notas que se realizo a la medida, entonces encontré una manera mucho mas fácil y elegante para generar reportes en PDF desde wordpress,  y no morir en el intento.

Tipo de Conocimiento que Necesitas

Antes de continuar con el articulo, debes de saber que no será nada fácil si no tienes conocimiento básico en CSS, HTML, y medio o avanzado en WordPress y por supuesto en PHP. También es importante que sepas que lo anterior no será un impedimento si eres de esos programadores que consultan documentación en caso de estar perdidos.

Ambiente de Trabajo

Para el ejemplo practico trabaje en localhost, sin embargo, esto es lo mismo para trabajarlo desde un Hosting o VPS. Además, trabaje con lo siguiente:

1. WordPress Versión 6.0: Es la versión actual del wordpress a la fecha de realizado el ejercicio practico.
2. Theme a la medida: C0mo theme base, he usado un theme de mi autoría (Bastante sencillo), el cual lo use conjunto a Elementor en su versión free.
3. XAMPP 7.4: En este entorno puse en marcha el ejemplo de como generar un PDF en WordPress.

Obviamente para el trabajo he usado algunos plugins, ya que todo a la medida no era tan necesario, lo sabroso del ejemplo es como se generar un PDF desde WordPress de manera dinámica, y no como montar un sitio desde cero totalmente, así que los plugins que use fueron los siguiente:

1. WCK: Este plugin lo he usado para crear un Post Type, donde se almacenaran los datos de las notas, amplié los campos de la información a guardar con el siguiente plugin.
2. CMB2: Este plugin me sirvió para generar los campos necesarios para guardar información como el nombre del alumno, nombre del curso y las notas, pero de manera «Estática», ya que en el ejercicio real, esto lo hice mediante id del estudiante, y el id del curso, y ya con esto puedo hacer las demás consultas de interés.
3. Elementor 3.6.6: Con mi adorado Elementor, he maquetado la parte donde genero los PDF, los cuales son algo bien simple, y con Elementor lo pude maquetar rápidamente sin perder mucho tiempo en esto ya que son dos simples botones.
4. Yoast Duplicate Post: Este plugin me fue de bastante utilidad para duplicar las notas y solo cambiar la información, esto ya es a modo personal, ya que las notas las pude simplemente crear una a una.

¿De que trata el ejemplo practico?

Pues bien, trate de realizar el ejemplo con un caso de la vida real, como es el de una institución académica, el cual genera un Histórico Académico de un estudiante en particular, mostrando los nombres y apellidos del estudiante, los nombres de los cursos tomando y la notal final de cada nota del estudiante. Adicional para este reporte unos campos para firma del estudiante y de la persona encargada del reporte, en este ultimo campo se muestra una firma en png ubicada en la parte de firma. Otro reporte en cual se genera un PDF con la constancia de que el estudiante cursa, asemejando un documento en Word listo para imprimir.

Adicional, en el ejercicio he usado una Google Font y CSS externo para mejorar la apariencia del PDF.

Trate de realizar el ejercicio lo mas parecido posible, ya que lo que hice en el proyecto, fue algo mucho mas complejo, que tiene que ver con Learndash y un modulo hecho a la medida para parametrizar notas (Cuantas notas hay en un curso y el porcentaje para cada corte de notas), y la respectiva carga de notas por parte de los funcionarios que deben de hacerlo. Todo lo anterior hecho desde el front.

Pero te aseguro que con este ejercicio practico, es mas que suficiente para que lo puedas adaptar a cualquier tipo de necesidad.

¿Cómo lo hice?

Para este ejemplo de como generar PDF dinámico en WordPress he metido todo el código en el theme base que he usado. La magia esta en los Page Template, donde he creado uno para cada tipo de PDF que se genera en el sistema, es decir uno para el Reporte en PDF y otro para la Constancia en PDF. Adicional, he usado los css respectivos para cada css, los cuales ya mostrare donde se ubican.

Para generar el PDF desde WordPress, he usado la librería php DOMPDF. En un próximo ejemplo, podría mostrar como generar un certificado tipo diploma, y con esto veremos la flexibilidad de esta librería al generar archivos PDF.

¿Cómo Funciona?

A continuación te dejo un video explicando como funciona el ejercicio para generar un PDF y así puedas tener una mejor guía de como re utilizar el código.

Descargar ejemplo para generar PDF dinámico en WordPress

Para descargar el ejemplo solo te pido algo que se que puedes hacer. Comparte este post en Facebook o Twitter (Prefiero Facebook) y seguidamente podrás descargar el código del ejercicio practico.