How to add a header and footer to a PDF generated with DOMPDF and Laravel 5.8

Stefan Bogdanescu

Founder & Senior Architect · 2026-06-29

Laravel Company

Jako doświadczony programista, postaram się dostarczyć kompleksową odpowiedź dotyczącą Twoich pytań związanych z implementacją nagłówków (Header) i stóp (Footer) oraz dynamiczną numeracją stron w przypadku generowania plików PDF.

Problemy, które napotykasz, wynikają zazwyczaj z mieszania logiki prezentacji (HTML/CSS) z logiką generowania dokumentu (PDF generation). Poniżej przedstawiam szczegółowe podejście techniczne i najlepsze praktyki.


1. Implementacja Nagłówków i Stóp w PDF

Aby nagłówek i stopka były widoczne na każdej stronie wygenerowanego PDF, musimy rozróżnić, jak to osiągnąć w zależności od narzędzia, którego używasz do generowania PDF (np. biblioteki PHP/Python, JavaScript z Puppeteer, czy systemy typu LaTeX).

A. Struktura HTML/CSS dla Widoczności na Stronie Webowej

Jeśli generujesz PDF za pomocą konwertera przeglądarki (jak wkhtmltopdf), najprostszym sposobem jest użycie standardowego CSS do ustalenia stałego położenia elementów:

/* W pliku CSS */
header {
    position: fixed; /* Utrzymuje nagłówek na stałe, niezależnie od przewijania */
    top: 0;
    left: 0;
    width: 100%;
    background-color: #f0f0f0; /* Przykład tła */
    z-index: 1000; /* Upewnia się, że nagłówek jest nad treścią */
}

footer {
    position: fixed; /* Utrzymuje stopkę na stałe */
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #e0e0e0;
    z-index: 1000;
}

/* Ważne: Musisz odjąć wysokość nagłówka/stopki od treści, aby treść nie była zasłonięta */
body {
    padding-top: 60px; /* Dodać miejsce na zawartość nagłówka */
    padding-bottom: 50px; /* Dodać miejsce na zawartość stopki */
}

B. Wyzwanie PDF i Rozwiązanie (Dynamiczna Numeracja Stron)

W przypadku generowania PDF, standardowe CSS z position: fixed działa na stronie internetowej, ale nie jest bezpośrednio przenoszone do formatu PDF. Aby uzyskać dynamiczną numerację stron w stopce PDF, musisz zastosować logikę po stronie serwera lub w bibliotece generującej PDF.

Najlepsza praktyka: Nie polegaj wyłącznie na HTML/CSS dla elementów statycznych w PDF. Zamiast tego, użyj funkcji specyficznych dla generatora PDF:

  1. Logika Serwerowa (PHP/Python): Po wygenerowaniu wszystkich stron dokumentu, skrypt serwerowy powinien iterować po każdej stronie i dynamicznie wstawiać numer strony oraz informacje o całkowitej liczbie stron do stopki każdego pliku.
  2. Biblioteki PDF: Jeśli używasz bibliotek takich jak TCPDF czy FPDF w PHP, te biblioteki oferują mechanizmy do ustawiania nagłówków i stóp na poziomie dokumentu, które automatycznie obsługują numerację.

2. Dodawanie Dynamicznej Numeracji Stron do Stopki

Aby dodać dynamiczną informację typu "[page number] from [number of pages]" do stopki, musisz mieć dostęp do informacji o aktualnej pozycji w całym dokumencie.

Przykład Koncepcyjny (Pseudokod dla Logiki Serwerowej)

Załóżmy, że generujesz PDF i masz dostęp do obiektu document oraz liczby stron:

// Wewnątrz pętli generującej strony...
$currentPage = $pageNumber;
$totalPages = $totalPageCount;

// Tworzenie stopki dla bieżącej strony
$footerContent = "Strona $currentPage z $totalPages";

// Wstawienie do szablonu PDF
$pdf->write($pageNumber, $content);
$pdf->addPage();
$pdf->writeFooter($footerContent); // Funkcja generująca stopkę

W tym scenariuszu, zamiast polegać na statycznym HTML, używasz kodu po stronie serwera do wstawienia zmiennych dynamicznych bezpośrednio w strukturę PDF. Jest to znacznie bardziej niezawodne przy tworzeniu profesjonalnych dokumentów (co jest kluczowe, gdy rozwijasz projekty, podobnie jak w przypadku frameworków Laravel, które dążą do czystej i strukturalnej implementacji).

3. Analiza Twojego Fragmentu Kodu HTML

Fragment kodu, który mi dostarczyłeś, zawiera już strukturę stopki:

<tfoot>
    <!-- ... treść sumowania ... -->
    <tr...>
        <td colspan="3">&lt;/td&gt;
        <td align="right">Total $&lt;/td&gt;
        <td align="right" class="gray">$ 1929.3&lt;/td&gt;
    </tr>
</tfoot>

Jeśli chcesz, aby ta stopka była widoczna w PDF i zawierała dynamic