Watermark and logo in pdf template

[anonymous]

Hi everyone
I’m trying to create a template report for my answers, but when I try to insert the company logo (image that can move) or a watermark (fixed in the background of the sheet), they disappear or change the appearance of the template.
how do i go about having one or both?
thanks a lot for the help, I’m really in great difficulty!

[anonymous]

Hello,
Did you manage to fix it?

[Marc_Dillon]

Appsheet templates cannot handle background images.

[Fabian_Weller]

Today I found a new option in google docs: Watermark.

I did a quick testing: In PDF will contain the image. But not in the background as a watermark, but in the front and in the beginning of the document.

Template

PDF

[adminshashwat]

IS IT POSSIBLE IN NEAR FUTURE?

[Steve]

I am not aware of any plans to change the existing behavior.

[hien_nguyen]

Please update this feature

[SkrOYC]

You can by using an HTML template.
I tested and worked if the URL has no & in it, which means that you cannot add a watermark from an image column of your app dynamically but you can hardcode any image you want.

Edit: Unless you know a little Javascript… check my Part 3 for info

This is a sneak peak of one of the templates of Part 3 where I added the watermark just to demonstrate:

The image used is from Open Source Chart Image API | QuickChart

The basics are these:

body::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  background-image: url("https://quickchart.io/chart?c={type:'bar',data:{labels:['Q1','Q2','Q3','Q4'], datasets:[{label:'Users',data:[50,60,70,180]},{label:'Revenue',data:[100,200,300,400]}]}}");
  background-size: 500px;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  opacity: .3;
  z-index: -2;
}

[Suvrutt_Gurjar]

Nice and impressive @SkrOYC

[SkrOYC]

Thanks @Suvrutt_Gurjar

[SkrOYC]

@SkrOYC

Unless you know a little Javascript… check my Part 3 for info

Part 3: Pixel perfect reports with Skia (AppSheet’… - Google Cloud Community

[Harriswe]

I would like to see this added as a feature too. In the legal world there are complex layout templates that need completing on a regular basis. The inability to handle a watermark image in the PDF template means this task cannot be automated using AppSheet, which is frustrating. @SkrOYC example is a ‘possible’ work-around but it is a lot of work for a template you do not OWN and is therefore likely to change. The ability to use a watermark template offers a simple solution by overlaying the fields on-top. See screenshot, where I have left the outline of the table visible.

Even trying this as an image and not a watermark results in the picture being shown first then all the text on the 2nd page. There are dozens of these templates in the legal world, which is no doubt the same in many jurisdictions for which AppSheet cannot assist with. Hence the feature request.

[SkrOYC]

[quote=“Harriswe”]
for a template you do not OWN and is therefore likely to change
[/quote]#

[Harriswe]

@SkrOYC yes, these are templates in the public-domain published by regulators, government bodies (think tax-return as a example) , department of justice for legal / court forms… to name just a few.

[SkrOYC]

I understand.
Well, sometimes some thing can take time, like mastering AppSheet, but the possibilities that arise after that period are almost endless

[Harriswe]

For sure I agree. However manually positioning each field is big maintenance overhead. The ability to have a simple watermark in the template representing the form-layout drastically reduces the maintenance overhead.

[FaCe]

Hi, any update on that ? No way for AppSheet to support Watermark inside Templates (Google Doc) ?

[FaCe]

Hi @SkrOYC may you please elaborate a bit how to do it ?

I’ve a Google Doc template … then ?

[SkrOYC]

@FaCe

I’ve a Google Doc template … then ?

Throw it away and start with HTML/CSS.

I know it sounds like a nightmare if you don’t know about HTML/CSS, but that’s the best path.

The fastest would be to save your GDoc as HTML and work with it, but I cannot guarantee anything about the format you get doing so. You could try adding the watermark to it after this conversion and see what happens

@SkrOYC

body::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background-image: url("ImageURLHere");
  background-size: 500px;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  opacity: 0.3;
  z-index: -2;
}

Just adding the code above should be enough

[FaCe]

I’ve inserted your code but the result it’s that at the end of html page appears the code inserted and not the image … how can i solve it ?

here’s the code (last lines of my html taken from my Template exported from Google Doc in html + your code)

…

www.mywebsite.it

body::after {
content: “”;
position: absolute;
top: 0;
left: 0;
background-image: url(‘mypic’);
background-size: 500px;
background-position: center;
background-repeat: no-repeat;
width: 100%;
height: 100%;
opacity: 0.3;
z-index: -2;
}