Show appian image in pdf generated

RE: Show appian image in pdf generated

aishwaryaa913655 — Wed, 24 Apr 2024 07:19:07 GMT

got it. will try it. thanks

RE: Show appian image in pdf generated

Stefan Helzle — Wed, 24 Apr 2024 06:56:32 GMT

I use that CSS to adjust the size of the images. Without it, all images are rendered full page.

RE: Show appian image in pdf generated

aishwaryaa913655 — Wed, 24 Apr 2024 06:51:52 GMT

If i have dynamic images loaded lets say 3 images, You mentioned -> separate max-width CSS for the image tag made the difference. This tag will be applicable on images wherever i show it. It should bring up the images right?

RE: Show appian image in pdf generated

Stefan Helzle — Wed, 24 Apr 2024 06:31:11 GMT

The provided HTML code will not show any image when directly opened in a browser. It is specifically meant to be processed by the HTML-to-PDF plugin.

RE: Show appian image in pdf generated

aishwaryaa913655 — Wed, 24 Apr 2024 03:57:26 GMT

If I directly use this code in my process model html template its showing image icon but no image in it. Should i use it with that plugin? Stefan Helzle

RE: Show appian image in pdf generated

aishwaryaa913655 — Wed, 24 Apr 2024 03:39:03 GMT

Thank you everyone. I will try this and update here Stefan Helzle .

RE: Show appian image in pdf generated

Shubham Aware — Tue, 23 Apr 2024 15:57:53 GMT

Nice! Good to know Stefan.

RE: Show appian image in pdf generated

Stefan Helzle — Tue, 23 Apr 2024 14:58:40 GMT

After updating my post, I started to investigate the source code of the plugin and found an undocumented feature. You can easily add an image, uploaded into Appian, using the following HTML.

<img appianDocId="12345" />

What a welcome surprise !!!

I had a hard time to adjust the size of the image as the plugin manipulates the inline style of images, but was successful using the following code:

<!DOCTYPE html>
<html>
<style>
img {
  max-width: 100% !important;
  max-height: 100% !important;
}
div {
  width: 50mm;
  height: 60mm;
  border: dotted 5px black
}
</style>
<body>
<div>
<img appianDocId="22613" />
</div>
</body>
</html>

The separate max-width CSS for the image tag made the difference.

I am going to add this to my post as well.

Have fun!

RE: Show appian image in pdf generated

Stefan Helzle — Mon, 22 Apr 2024 11:09:44 GMT

I like idea nr 3. The plugin can add an image at a specific page and coordinate and scale it to a width and height. So, we can add a placeholder to the HTML and add the image on top in a second step.

I will test this and update my blog post: https://appian.rocks/2023/10/23/great-pdfs-with-appian/

RE: Show appian image in pdf generated

Mathieu Drouin — Mon, 22 Apr 2024 10:35:04 GMT

Check put this thread on some options for converting images to base64.

community.appian.com/.../133826

RE: Show appian image in pdf generated

aishwaryaa913655 — Mon, 22 Apr 2024 10:12:19 GMT

i dont see base64 encoding is direct in appian. plugin also has database conversion for base 64 document. Is there anyway to do it dynamically. Because my images i will know the document IDs on runtime querying they recordtype.

RE: Show appian image in pdf generated

Shubham Aware — Mon, 22 Apr 2024 09:59:12 GMT

Hello ,

But you can try this options :-
1) Upload image publicly(cloud storage).Use image URL directly in HTML's src attribute.
2) Encode image to Base64, pass it to your HTML template, use "data:image/jpeg;base64,[your_data]" in the image source to display it in the PDF.
3) Try this plugin Add Image To PDF - To add image in the PDF document

RE: Show appian image in pdf generated

Stefan Helzle — Mon, 22 Apr 2024 09:24:40 GMT

To embed an image into a PDF in the way you described, that image must be added as base64 encoded image in the HTML. At least, that is the only way I am aware of.

To add company logos, I convert these using an external service and copy the string into a constant which I then use for generating the HTML.