Velocity has no headers and footers?

Questions
1

I’ve been checking out how to add headers and footers to Velocity but am unable to find anything in the documentation about it. Am sure I am missing something as this would seem essential to a report generator; would anyone be able to let me know what I am missing?

Thanks,

2

Velocity is not a classic reporting generator like jasper or crystal reports. It’s primarily function is to fill data into a template and use that to generate PDF.
But the parser supports @page extensions that allow you to define header and footer - search for CSS @page for more info.
It also supports a special property “-fs-table-paginate: paginate;” that allows you to repeat a table header on multiple pages as well.

See the attached PDF (with header and footer repeated on each pages, as well as table header) and here’s the significant part of the template that generated it:
Note in particular the @page definition and div.header/div.footer and how they are placed:

<!DOCTYPE html>

<html lang="$!lang">

<head>
	<title>$!title</title>
	<meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>
	<meta content="utf-8" http-equiv="encoding"/>

	<style>
		html, body, * {
			font-family: 'Libre Franklin', Helvetica, Arial, sans-serif;
			font-size: 10pt;
		}
						
		.container {
			margin: auto;
		}
		
		.break {
			page-break-after: always;
		}
		
		table {
			-fs-table-paginate: paginate;
		}
		
		tr, td {
			page-break-inside: avoid;
			vertical-align: top;
		}
						
		.header {
			width: 100%;
			margin: 0px;
			padding: 0px;
		}
		
		.footer {
			width: 100%;
			text-align: center;
			margin: 0px;
			padding: 0px;
			font-size: 7pt;
		}
		
		div.header { display: none; }
		div.header { display: block; position: running(header); }
		div.footer { display: none; }
		div.footer { display: block; position: running(footer); }
	
		@page {
			size: letter landscape;
			counter-increment: page;
			margin: 1.4in .4in .6in .4in;
			
			@top-center { 
				content: element(header); 
			}
			
			@bottom-center {
				content: element(footer);
			}
			
			@bottom-right {
				content: "Page " counter(page) " / " counter(pages);
				font-family: 'Libre Franklin', Helvetica, Arial, sans-serif;
				font-size: 7pt;
			}
		}
	</style>
	
	</head>

	<body>

		<div class="container">

			<div class="header">
				<table border="0" width="90%">
					<tr>	
						<td width="15%"><img src="${serverURL}/assets/images/logo.png" class="logo"/></td>
						<td><h2 style="text-align:center;font-weight:bold">#h($!header)</h2></td>
					</tr>
				</table>
			</div>

			<div class="footer">#h($!footer)</div>

			<div class="row">
				<div class="col-md-5">
					#h($!demandeur)


				</div>
			</div>
			
			<div> etc... </div>
			
		</div>

	</body>
</html>

3000231.pdf (32.6 KB)

3

Thanks for that; much appreciated. I didn’t realise the @page was supported, will try it out.

4

Thanks for the example Patrick, a very nice example. Is Velocity your preferred tool for formatted reports. in Servoy? I’d be interested to know how you rank it compared to Jasper and other contenders.
Which has the best functionality for outputting reports in formats other than PDF?

Regards