Generated date in report footer

1

Could someone point me in the right direction to achieve “generated” date (current date) in reports please?

Maybe just a basic example?

I see mentions of html, javascript and liquid but nothing current and definitive.

Not knowing when a report was generated makes it impossible to know which e.g. printed copy is the later (or latest).

2

Simply add the following to your footer.

div style=“margin-top: 2px; color: lightgrey; font-size: 9px;”>
This Invoice is system generated and does not require a signature if received from the official email address of Xavier Registrations Pty LTD.
Document printed on: @@Timestamp@@

/div>

image

3

Thanks, but unfortunately that just displays the source.

Is there some surrounding code required?

4

Some progress. Strangely, left angle brackets had been stripped in copy/paste.

But @@Timestamp@@ is not being decoded. Any ideas?

5

post a screenshot of your footer here.

6

Report Design:

Screenshot 2025-08-26 at 18.04.54
Screenshot 2025-08-26 at 18.04.541236×196 8.25 KB

Result:

Screenshot 2025-08-26 at 18.04.29
Screenshot 2025-08-26 at 18.04.291318×196 3.6 KB

style doesn’t work either

7

What version are you using and where are you creating this ?

image

8

25.8.3.2541

Reports→Balance Sheet→Balance Sheet ⁠— View→Balance Sheet — Edit

9

If you using it in the report footer, use the following code.

Print Date Example @page { counter-increment: page; } 
/* Footer for print */
@media print {
  body {
    margin: 0;
    padding: 0;
  }

  #footer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 12px; /* keep it small */
  }

  #pagenumber:after {
    content: counter(page);
  }
}
Page 1
10

Screenshot 2025-08-26 at 23.53.41
Screenshot 2025-08-26 at 23.53.411350×790 21.9 KB

11

Hello @berniev,

Reports have no timestamps. Only transactions do.

Also, report footers and Settings > Footers are two different things so the merge tags will not work on your reports.

To do that you need to use Javascript

<div id="tstamp" style=“margin-top: 2px; color: lightgrey; font-size: 9px;”></div>
<script>
   var tstamp = new Date(Date.now());  
   document.getElementById('tstamp').innerHTML = tstamp;
</script>
12

Thanks @Ealfardan. That produces a datetime string in the report.

However, the style part of the div does nothing.

It seems there is no documentation for any of this ..?

13

Here’s what did work:

<div id="tstamp" style="margin-top: 2px; color: grey; font-size: 11px;"></div>
    <script>
      document.addEventListener('DOMContentLoaded', () => {
        const el = document.getElementById('tstamp')
        el.textContent = `Generated: ${new Date().toLocaleString()}`
      })
    </script>

Problem with style was the use of so-called ‘smart quotes’: “ and ”

2 Likes
14

You need to place this in between <style></style> tags:

1 Like
15

This is the footer I get with the code shared.

image
image744×114 1.39 KB

<!DOCTYPE html>
<html>
<head>
  <title>Print Date Example</title>
  <style>
    @page {
      counter-increment: page;
    }

    /* Footer for print */
    @media print {
      body {
        margin: 0;
        padding: 0;
      }

      #footer {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        text-align: center;
        font-size: 12px; /* keep it small */
      }

      #pagenumber:after {
        content: counter(page);
      }
    }
  </style>
</head>
<body>
  <div id="headerline"></div>

  <div id="footer">
    Page <span id="pagenumber">1</span>
  </div>

  <script>

    function updateHeader() {
      const now = new Date();

      // Format the date with full month name
      const dateOptions = { year: "numeric", month: "long", day: "numeric" };
      const formattedDate = now.toLocaleDateString(undefined, dateOptions);

      // Format the time
      const timeOptions = { hour: "2-digit", minute: "2-digit", second: "2-digit", hour12: false };
      const formattedTime = now.toLocaleTimeString(undefined, timeOptions);

      // Single-line output
      document.getElementById("headerline").innerHTML =
        "Printed on " + formattedDate + " at " + formattedTime;
    }

    updateHeader();
    setInterval(updateHeader, 1000);
  </script>
</body>
</html>
2 Likes