Error when adding an image within a HTML <td> tag

[MattG]

I've got an HTML NPrinting report that uses a HTML table

Within this table I'm using values from a Qlik table which works fine.

<tr>
<td class="summary_cells_label" style ="border-left:1px solid #333333;border-right:1px solid #333333">Standbys</td>
<td class="summary_cells_totals"style ="border-right:1px solid #333333">%%Standbys%%</td>
</tr>

This is working fine. I've now got a small image I wish to add to a third <td> 

<img src="%%TX279%%" alt="TX279">

If I place this anywhere else in my HTML page, it works fine, but when it is within the <td> tag it produces a broken link image, and adds the following text above the table

YAAACUef2IAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwgAADsIBFShKgAAAAChJREFUOE9jkH/A9Z8WeNRgOB41GI5HDYbjUYPheNRgOB41GIq5/gMAb0ZRPpWGNTwAAAAASUVORK5CYII=" alt="TX279"">

Does anyone know what could be causing this?

[Lech_Miszkiewicz]

Hi, 

I am using images in tables with NPrinting without any issues. Please provide:

• detailed HTML template code
• QlikView/Qlik Sense version
• Object which is used as an image details
• Screenshots of expanded properties of all objects used in the template

Alternatively you can build sample app, get a nprinting template going and export them and attach here so we can easily replicate your issue. 

BY THE WAY - Which SR of MAy 2022 are you using? and which version of Qlik Sense?

[Ruggero_Piccoli]

Hi,

It is not a broken link, it is correct. Images are inserted as Base64 Images (refer to https://www.w3docs.com/snippets/html/how-to-display-base64-images-in-html.html for example) in the generated reports so each report is made with a single file. 

The source HRML code is something like this:

The first versions of HTML report inserted the links to images and kept them as external files. In this way, every single generated report was made of many files and the links could be broken while moving them.

Best Regards,

Ruggero

[Lech_Miszkiewicz]

Hi @MattG @Ruggero_Piccoli 

Ruggero is right re base64 images however that does not clarify why it is not working for you. 

so as I said in my previous email - make sure you provide all details on what you do and how you do it so we can replicate steps and your issue and either tell you what you do wrong or what needs to change to get this done right. Cheers 

[Ruggero_Piccoli]

Hi,

How HTML is rendered depends also on the browser or the email client used to read it. In case of errors or if it is rendered in a different way than the one expected, I suggest testing with different email client. 

Best Regards,

Ruggero

[Lech_Miszkiewicz]

@Ruggero_Piccoli Is 100% right here. If this is in email client that is totally different story.
i was under assumption that this does not even work in web browser html preview. Again - we need all info to see what the scenario actually is as there can be 100s of different answers here  

[Frank_S]

If you are interested, the Qlik Help page on the rendering topic has been updated that supports the earlier comments as well.

https://help.qlik.com/en-US/nprinting/May2022/Content/NPrinting/HTMLReports/IntroHTML.htm

• The final output of emails with embedded HTML reports may differ depending on the email clients and permissions of the recipient. Some systems automatically block images, or show them as attachments.

Kind regards,

[MattG]

@Lech_Miszkiewicz 

I'm using Qlik NPrinting May 2022 SR4 Version: 22.15.14.0

with QlikView May 2022 Version 12.70.20000.0

The object the image is of is a text box with conditional colour to create a traffic light type indicator. 

I'm also really confused now. The exact code thats been broken for a few days, is working as intended today. 

I didn't change anything and was in the process of running it to generate some screenshots of the issue. 

In regard to some other queries, the code is only being run in NPrinting preview mode, using MS Edge.

The issue appeared to be the <img src="%%TX280%%" alt="TX280"> tag not translating into a base64 for the browse to render it. When viewing the source of the page, you could see one image where it translated correctly, but for the one with the broken link, the <img src="%%TX280%%"... html tag was still in place, indicating %%TX280%% hadn't been converted by NPrinting. 

What was further making me believe the issue was a NPrinting bug, was of my three columns, if the image was in the first <td> tag, it rendered, if in the first and third it rendered, but in the third by itself it broke.

As for @Ruggero_Piccoli , where the image was supposed to be I had a broken link icon within the target cell, such as this . The base64 was then sitting outside of the table.

I'll monitor it for now and see if the problem reappears. 

[Lech_Miszkiewicz]

Hi @MattG ,

I am glad this is somehow working now but... If your goal is to do just traffic lights it is much better practice to do conditional format of the cell in HTML. You can populate cell with asci character such as those ones ● or  █ and use this concept to colour code it:

https://community.qlik.com/t5/Qlik-NPrinting/Nprinting-HTML-How-change-background-color-based-on-the...

or 

you can use even simpler solution with emojis: 🔴 🟡 🟢

[MattG]

Yeah I played with conditionally formatting the font colour which worked. The client wanted a larger image though so I started playing with the image option.