I have practicing a lot and I keep being impressed by the amount of things that can be done compared to the traditional and kind of basic GDocs/MSWord way.
But I don’t have all the use cases that could benefit from this amazing and powerfull way of templates.
That’s why I’m asking you to give some of the most headache-given templates and maybe even ones that you weren’t able to make to see how this thing I’ve learning could help you and also others!
At the same time I’d love to use some of these on my Part 2 of Pixel Perfect reports.
I’m planning to show you the use of the default AppSheet html-to-pdf conversion tool and a third party one that has full support for CSS Paged Media Module (the one that provides header, footer, automatic numbering, and more!)
As I said on the Part 1 of the trick, I’m really excited about all of this because of how powerful it is.
Let me know your complex GDocs/MSWord templates and I could give you an HTML/CSS version that -hopefully- works better and even one that works in case you weren’t able to make it with traditional templates
This does look really promising, I’ll have to dust off my CSS skills, I used to do a lot of web page development!
There was a question on here recently, about a week ago I think, but I couldn’t find it. From what I remember there person wanted to display three records side by side in a template. The records had an image, comment and date I think and they wanted it to appear like this:
Image 1
Image 2
Image 3
Caption 1
Caption 2
Caption 3
Date 1
Date 2
Date 3
The problem is of course with a template, when you iterate through records and use tables, you can only get a row at a time. I’m pretty sure that if each table was a record (so the start and end expressions wrap a
You may well be doing this already, but perhaps some of the CSS itself could be stored in tables in AppSheet. This could allow for users to select the “theme” or other options for their reports. You could have some specific styling options like font and background colours stored either in user settings or a user preferences table. Then pull them into the template along with the data, either selecting from a predefined list of classes or IDs or even actual values in the style section of the header.
Have you ever wondered how to add an image to a template but control the size completely and prevent AppSheet from generating an anchor () aka hyperlink with it?
How do you make sure to have the table header on every page after a page break? For example, the data inside the table is so big that it has to break into more pages but the headers are lost?
Well, it’s a GDocs/MSWord template problem.
Table headers on HTML make this work by default.
If the data is too long and there are page breaks, the info on the is printed again on the next page.
# This is a sample doc made today
<<TODAY()>>
by <<LOWER(USEREMAIL())>>
<table>
<tr>
<th>
HEADER
This one is 15% of the width
</th>
<th>
HEADER
This one is 30% of the width
</th>
<th>
HEADER
This one is 40% of the width
</th>
<th>
HEADER
This one is 15% of the width
</th>
</tr>
<tr>
<td>
ROW 1
</td>
<td>
ROW 1
</td>
<td>
ROW 1
</td>
<td>
15
</td>
</tr>
<tr>
<td>
ROW 2
</td>
<td>
ROW 2
</td>
<td>
ROW 2
</td>
<td>
5
</td>
</tr>
<tr>
<td>
ROW 3
</td>
<td>
ROW 3
</td>
<td>
ROW 3
</td>
<td>
24
</td>
</tr>
<tr>
<td colspan="3">
Total
</td>
<td>
44
</td>
</tr>
</table>
# And this is on a new page. Page break baby!
<table>
<tr>
<th>
HEADER
This one is 15% of the width
</th>
<th>
HEADER
This one is 30% of the width
</th>
<th>
HEADER
This one is 40% of the width
</th>
<th>
HEADER
This one is 15% of the width
</th>
</tr>
<tr>
<td>
ROW 1
</td>
<td>
ROW 1
</td>
<td>
ROW 1
</td>
<td>
15
</td>
</tr>
<tr>
<td>
ROW 2
</td>
<td>
ROW 2
</td>
<td>
ROW 2
</td>
<td>
5
</td>
</tr>
<tr>
<td>
ROW 3
</td>
<td>
ROW 3
</td>
<td>
ROW 3
</td>
<td>
24
</td>
</tr>
<tr>
<td colspan="3">
Total
</td>
<td>
44
</td>
</tr>
</table>
And save it as .html
Then use it instead of a GDocs/MSWord file and you will see
@SkrOYC I would like to have some templates, also how a temaplate looks like with a header and that the next page the childtable-output starts on a proper place beneath a header?
When it comes to headers and footers, the AppSheet backend doesn’t support it (they use Skia, same one used by Chromium), but I’m ending my Part 2 where I explain some workarounds using another service that supports full CSS styling.
About the table headers, yes, HTML tables support that by default. So if you have a lot of rows, the next page will have the table header.
Hey budy! I was taking a look at these comments and found that I already did this on Part 3, I’m planning on posting it on the next 2 weeks. So I guess you will like it @graham_howe
I didn’t added CSS inside a record but used some styling that’s applied dynamically via CSS
Hi @SkrOYC ,
Firstly, I have to say that you are doing a great job sharing all that stuff with us. Thank you for that! I think I have a question directly related to this topic but wasn’t sure if this is the best place to ask this question. The thing is about custom HTML templates, Outlook & AppSheet… Do you also find it troublesome? Maybe you have some tricks that are important to know while coding and implementing. I write quite a lot of templates and there is always a problem with rendering in Outlook desktop app. This topic is about difficult template use cases, here it is (at least for me)
Regards
