CSS for Reports

From PikaDocs

Some notes on using CSS on reports.

  • copy templates/real-empty.html to templates/report1.html
  • create a new css file, or copy an existing one, to css/report1.css
  • edit the new templates/report1.html to use the new css file like so:
<html>
  <head>
  <link href="%%[base_url]%%/css/report1.css" rel="stylesheet" type="text/css"/>
    <title>Pika Report</title>
  </head>
  • modify a report to use this new template file. For instance, at the end of many report files you find a line like this:
$buffer = pl_template($plTemplate, 'templates/real_empty.html', 'yes');

Change it to this:

$buffer = pl_template($plTemplate, 'templates/report1.html', 'yes');

Now you can start using CSS to modify the look of your reports.

An Example using page breaks

I added a new CSS tag to report1.css:

div.pagebreakafter {page-break-after: always;}

Then, at a few key places in my report file I inserted this:

// put a page break
$C .= "<div class='pagebreakafter'></div>";

At every point in the report where I have that line, a CSS page break will be outputted on the page. These page breaks do not appear when viewing the report, but appear when printing it.

For more information on page breaks with CSS, click here (http://www.google.com/search?hl=en&amp;sa=X&amp;oi=spell&amp;resnum=0&amp;ct=result&amp;cd=1&amp;q=css+page+breaks&amp;spell=1)


Andrew Cameron 2006/8/7 initial entry. This information is current as of Pika 3.05 although Aaron has talked on the user list of changing how Pika reports are constructed in future versions.