HTML a PDF con PHP usando dompdf y Bootstrap

Generar PDF con PHP usando dompdf

Resumen: mostrar cómo generar PDF con PHP de una forma sencilla a través de HTML, respetando estilos CSS para darle buena forma a los PDF creados con PHP.

Vas a aprender a crear un PDF a partir de HTML (es decir, se va a convertir código HTML a un documento PDF bien hecho), usando dompdf. Al final, los documentos podrán ser:

  • Mostrados en el navegador
  • Forzados para descargar
  • Guardados en el disco duro

También incluyo un ejemplo con Bootstrap y con estilos CSS.

Instalación de dompdf

Instalamos dompdf con:

composer require dompdf/dompdf

Recuerda, si no sabes usar Composer, mira por qué usar composer.

Después de instalar dompdf recuerda incluir el autoload:

include_once "./vendor/autoload.php";

Generar PDF con PHP: hola mundo

En resumen, se debe crear una instancia de Dompdf; invocar a loadHtml pasándole el código HTML como string e invocar a render (que convertirá el HTML a PDF, generando un PDF con PHP)

<?php
include_once "./vendor/autoload.php";
use Dompdf\Dompdf;
$dompdf = new Dompdf();
$dompdf->loadHtml('<h1>Hola mundo</h1><br><a href="https://parzibyte.me/blog">By Parzibyte</a>');
$dompdf->render();
$contenido = $dompdf->output();
$nombreDelDocumento = "1_hola.pdf";
$bytes = file_put_contents($nombreDelDocumento, $contenido);

Para obtener el contenido invocamos a output; ese contenido puede ser escrito en el disco duro con file_put_contents.

En la línea 3 indicamos que usaremos Dompdf del namespace de Dompdf. En la línea 5 cargamos el HTML que podría venir de cualquier lugar, por ejemplo, de la lectura de un archivo.

Invocamos a render en la línea 6, esto es el proceso más tardado pues genera el PDF. Finalmente obtenemos el contenido en la línea 7 y lo guardamos con el nombre 1_hola.pdf en la línea 9.

Generar PDF con PHP usando dompdf - Hola mundo
Generar PDF con PHP usando dompdf – Hola mundo

Como se puede ver, el HTML se ha convertido en un PDF.

Múltiples formas de exportar el documento PDF

En el ejemplo de arriba vimos cómo guardar el PDF en el disco duro.

Pero podemos mostrarlo directamente en el navegador; para ello mostramos algunos encabezados para mostrar el PDF en el navegador y después imprimimos su contenido:

<?php
include_once "./vendor/autoload.php";
use Dompdf\Dompdf;
$dompdf = new Dompdf();
$dompdf->loadHtml('<h1>Hola mundo</h1><br><a href="https://parzibyte.me/blog">By Parzibyte</a>');
$dompdf->render();
header("Content-type: application/pdf");
header("Content-Disposition: inline; filename=documento.pdf");
echo $dompdf->output();

Por otro lado, podemos forzar la descarga del documento usando el método stream como se ve a continuación:

<?php
include_once "./vendor/autoload.php";
use Dompdf\Dompdf;
$dompdf = new Dompdf();
$dompdf->loadHtml('<h1>Hola mundo</h1><br><a href="https://parzibyte.me/blog">By Parzibyte</a>');
$dompdf->render();
$dompdf->stream();

He presentado los tres métodos. En los siguientes ejemplos puedes usar cualquier método listado anteriormente, yo mostraré todo en el navegador.

Tabla con estilos CSS en PDF

La tabla

Ahora veamos cómo mostrar algo más que un encabezado y un enlace. Lo que haré será generar el contenido en un archivo externo, que además del HTML tiene estilos para dar bordes a la tabla.

<?php
$mascotas = ["Maggie", "Guayaba", "Meca", "Panqué"];
?>
<style>
/**
Tomado de https://parzibyte.me/blog/2018/10/16/tabla-html-bordes-css/
 */
table {
    border-collapse: collapse;
}
 
table,
th,
td {
    border: 1px solid black;
}
 
th,
td {
    padding: 5px;
}
</style>
<h1>Mis mascotas</h1>
<table>
    <thead>
        <tr>
            <th>Nombre</th>
        </tr>
    </thead>
    <tbody>
    <?php foreach ($mascotas as $mascota) {?>
        <tr>
            <td><?php echo $mascota; ?></td>
        </tr>
    <?php }?>
    </tbody>
</table>

Tenemos un arreglo de PHP y después generamos una tabla HTML a partir del mismo. Por el momento no hemos visto la generación del PDF.

Recuerda que en la vida real, el arreglo podría venir de una base de datos con PHP.

Generar PDF a partir de la tabla

Ahora vamos a incluir el archivo y esperar a que renderice, para eso voy a aplicar un truco que consta de las siguientes líneas:

<?php
ob_start();
include "./tabla.php";
$html = ob_get_clean();

De este modo obtengo el HTML generado y separo componentes, esto no es obligatorio ni tiene que ver con el pdf ni la librería, es un simple modo de obtener el código HTML.

El código para generar el pdf con PHP es:

<?php
include_once "./vendor/autoload.php";
use Dompdf\Dompdf;
$dompdf = new Dompdf();
ob_start();
include "./tabla.php";
$html = ob_get_clean();
$dompdf->loadHtml($html);
$dompdf->render();
header("Content-type: application/pdf");
header("Content-Disposition: inline; filename=documento.pdf");
echo $dompdf->output();

Y el resultado es:

Estilos y HTML complejo en PDF con PHP
Estilos y HTML complejo en PDF con PHP

Como ves, la librería dompdf leyó los estilos y los aplicó al renderizar el PDF.

Imágenes

Al generar pdf con PHP también podemos agregar imágenes. Recomiendo evitar el uso de una imagen de internet y en su lugar usar una local con una ruta de sistema de archivos .

Queda así:

<?php
include_once "./vendor/autoload.php";
use Dompdf\Dompdf;
$dompdf = new Dompdf();
ob_start();
include "./tabla.php";
$html = ob_get_clean();
$dompdf->loadHtml("<h1>Una imagen</h1><br>
<img src='./parzibyte.jpg'/>");
$dompdf->render();
header("Content-type: application/pdf");
header("Content-Disposition: inline; filename=documento.pdf");
echo $dompdf->output();

En este caso parzibyte.jpg está en el mismo directorio que el script. El resultado es:

Agregar imagen
Agregar imagen

Como ves, el PDF puede contener imágenes con estilos.

Usando estilo Bootstrap al generar PDF con PHP

Voy a terminar este tutorial de PHP mostrando cómo la librería puede interpretar las hojas de estilo, descargarlas y aplicarlas. Haré el ejemplo de la tabla solo que ahora le agregaré estilos CSS de Bootstrap.

Primero tengo la tabla:

<?php
$mascotas = ["Maggie", "Guayaba", "Meca", "Panqué"];
?>
<head>
    <link rel="stylesheet" href="./bootstrap.min.css">
</head>
<h1>Mis mascotas</h1>
<table class="table table-bordered">
    <thead>
        <tr>
            <th>Nombre</th>
        </tr>
    </thead>
    <tbody>
    <?php foreach ($mascotas as $mascota) {?>
        <tr>
            <td><?php echo $mascota; ?></td>
        </tr>
    <?php }?>
    </tbody>
</table>

Es una tabla con Bootstrap, fíjate que la misma tiene la clase table y table-bordered. En la línea 4 estoy cargando la hoja de estilos.

Ahora generamos el documento PDF:

<?php
include_once "./vendor/autoload.php";
use Dompdf\Dompdf;
$dompdf = new Dompdf();
ob_start();
include "./tabla_estilos.php";
$html = ob_get_clean();
$dompdf->loadHtml($html);
$dompdf->render();
header("Content-type: application/pdf");
header("Content-Disposition: inline; filename=documento.pdf");
echo $dompdf->output();

Con el siguiente resultado:

HTML a PDF con PHP usando dompdf y Bootstrap
HTML a PDF con PHP usando dompdf y Bootstrap

Conclusión

Recuerda que entre más grande sea el HTML y las hojas de estilo, se llevará más tiempo renderizar el documento a PDF.

La ventaja de todo esto es que puedes usar estilos bonitos y usar HTML para generar un PDF, usando un lenguaje que ya sabes, en lugar de aprender a usar la librería que crea PDF de manera nativa.

No olvides que además de mostrar directamente el documento puedes forzar su descarga o guardarlo de manera local.

Enlaces de interés

Si el post te gustó, te invito a ver más tutoriales de PHP.

No olvides visitar el repositorio de dompdf.

De igual forma puedes ver todo el código de los ejemplos en el repositorio de GitHub.

Estoy aquí para ayudarte 🤝💻


Estoy aquí para ayudarte en todo lo que necesites. Si requieres alguna modificación en lo presentado en este post, deseas asistencia con tu tarea, proyecto o precisas desarrollar un software a medida, no dudes en contactarme. Estoy comprometido a brindarte el apoyo necesario para que logres tus objetivos. Mi correo es parzibyte(arroba)gmail.com, estoy como@parzibyte en Telegram o en mi página de contacto

No te pierdas ninguno de mis posts 🚀🔔

Suscríbete a mi canal de Telegram para recibir una notificación cuando escriba un nuevo tutorial de programación.

8 comentarios en “Generar PDF con PHP usando dompdf”

  1. Excelente aporte!! Me ayudó mucho cuando empecé con Dompdf…
    Hoy tengo un problema, estoy haciendo un PDF pero necesito incluir algunas fórmulas matemáticas y científicas y no me acepta algunos símbolos, podrías orientarme si hay alguna forma??
    No tiene que ver con la fuente porque ya utilice varias y muestra “?” en algunos símbolos como el omega Ω u otros.

  2. Hola…gracias por este tutoria….solo agregaria que hay que codificar la imagen en base64 para que resulte en un servidor https…saludos!!

  3. Exelente tutorial, te felicito muy completo, por horas buscando en doc oficial, youtube etc, y lo solucionaste todo,
    mi duda puntual era a la hora de manejar datos dinamicos no podia transformarlos a pdf, con ob_start();
    y pasando la pagina por la funcion ob_get_clean() solucionado,.
    Gracias

Dejar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *