How to remove descriptions in the header label on clients statements

Support
1

Hi QFSteve

You recently told me how to remove some specific line items from client statements and I am just wondering if I can also remove the labels and data on the client statement header that I dont want to show the client.
ie invoiced (shows the total of all invoice issued in a given period)
payments (shows the total of all payments receievd in a given period)
and credits (shows the total of all credits in a gievn period)

Then I think my statements will be good to go.

I have now used inspect to view the scripts used to build my client statement and found where I can use a hide function to remove lines from the statement preview but I can’t see how I can save this format of my statement so I can use this amended layout for all future statement.

regards

Helen

2

The trick is the same as in your previous thread - once you’ve found the class names that uniquely identify the things you want to remove, you add rules to the client statement CSS to set them to display: none. In this case you want something like:

.invoice-details-tbl .invoice-details-row3,
.invoice-details-tbl .invoice-details-row4,
.invoice-details-tbl .invoice-details-row5 {
  display: none;
}

row3 is “invoiced”, row4 is “payments”, row5 is “credits”, and all three of those rows sit inside the element with class="invoice-details-tbl".

Explanation: when it’s generic names like “row 4” I prefer to put a bit more context into the rules to make sure they don’t catch anything they shouldn’t. You can put multiple complete selector expressions on the same block to apply the same block of settings to them all, and you read each selector from right to left - .a .b .c matches anything with class=“c” that is inside something with class=“b”, that in turn is inside something with class=“a”. So my code above matches row3 inside the details table, and row4 inside the details table, etc.

3

Hi Ian_Roberts
Thanks for the above sugestion.
When I added the lines you suggested to the two earlier suggestions that have worked
nothing changes on my statement
below is everything I have in the CSS desig area. First six lines are rcorrectly removing line items I don’t want to show on my client statement but the lines after that are not doing anything.
What am I missing?

.statementRow[data-type=“inv”]>td>div>div {
display: none;
}
.footer-pay-GBP-row {
display: none;
}
.invoice-details-tbl .invoice-details-row3,
.invoice-details-tbl .invoice-details-row4,
.invoice-details-tbl .invoice-details-row5 {
display: none;
}

Thanks helensara

4

My bad - looking again at the structure in my browser “inspect element” tool, the row classes are invoice label, not invoice details

Screenshot 2024-10-06 at 20.19.03

so you need

.invoice-details-tbl .invoice-label-row3,
.invoice-details-tbl .invoice-label-row4,
.invoice-details-tbl .invoice-label-row5 {
  display: none;
}
1 Like
5

Ian_roberts
Thank you. Your help is really appreciated and I now have a really good looking statement I can use for all my clients

6

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.