es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

¿Cómo hacer numeración de páginas en el pie de página de HTML con wkhtmltopdf?

31 May, 2023 Programación

Estás utilizando SnappyPDF y lograste agregar un pie de página HTML a tu archivo con este código en tu controlador de Laravel:

->setOption('footer-html', view('front.mail_templates.layouts.emailFooter'))
->setOption('margin-bottom', 17)

Pero ahora quieres agregar numeración de página y después de buscar encontraste esta solución:

->setOption('footer-right', "Page [page] of [toPage]")

El problema es que quieres que ambos aparezcan en el PDF pero no puedes hacer que funcionen juntos. Funcionan por separado, pero si están juntos solo aparece el pie de página HTML y la numeración de página es invisible. Al pasar el cursor por casualidad sobre un espacio vacío y copiarlo y pegarlo en otro lugar, descubriste que era el número de página impreso de manera transparente. ¿Es posible hacer que ambos aparezcan en tu pie de página? ¿Tienes alguna otra sugerencia?

EDICIÓN:

Aquí está el código HTML de tu pie de página:

<a href="https://i.stack.imgur.com/gHxwm.png">
    <img src="https://i.stack.imgur.com/gHxwm.png" alt="enter image description here">
</a>

Todo funcionaba bien hasta que agregaste el código de JavaScript, ahora genera el siguiente error: “El código de estado de salida ‘-1073741819’ indica que algo salió mal”.

Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Parece que el problema es que la opción “footer-html” está anulando la opción “footer-right”, por lo que solo se muestra el pie de página HTML. Una posible solución sería modificar el pie de página HTML para incluir también el número de página, en lugar de utilizar la opción “footer-right”.

    Podría agregar un span con un ID único (por ejemplo, id="page-number") al pie de página HTML donde desea que aparezca el número de página. Luego, en su controlador, podría usar JavaScript para actualizar el contenido de este span con el número de página actual, utilizando la función window.onload para asegurarse de que el DOM se haya cargado por completo primero.

    Aquí hay un ejemplo de cómo podría verse esto en su código:

    Pie de página HTML:

    <footer>
  <div class="row">
    <div class="col-md-6">
      Algunos contenidos de pie de página
    </div>
    <div class="col-md-6 text-right">
      <span id="page-number">Página [page] de [toPage]</span>
    </div>
  </div>
</footer>

    Controlador:

    use SnappyPDF;

// ...

public function generatePDF()
{
    $pdf = SnappyPDF::loadHTML(view('front.mail_templates.layouts.emailFooter')->render());

    // Agregar opciones para numeración de página
    $pdf->setOption('margin-bottom', 17);
    $pdf->setOption('footer-html', view('front.mail_templates.layouts.emailFooter')->render());
    $pdf->setOption('no-stop-slow-scripts', true);

    // Agregar JavaScript para actualizar el número de página
    $pdf->setOption('run-script', 'window.onload = function() { document.getElementById("page-number").textContent = "Página " + window.pageYOffset / document.body.scrollHeight + " de " + document.body.scrollHeight / window.innerHeight ;}');

    return $pdf->download('ejemplo.pdf');
}

    La opción no-stop-slow-scripts se agrega para permitir que se ejecute el JavaScript, y la opción run-script se utiliza para insertar el código JavaScript para actualizar el número de página.

    Tenga en cuenta que esta solución supone que su documento PDF tiene solo una página de longitud, y que el número de página aumenta linealmente a medida que el usuario se desplaza por la página. Si su PDF tiene varias páginas, o si los números de página no aumentan linealmente, es posible que deba modificar el código JavaScript para reflejar con precisión el número de página actual.

Comments are closed.