Repeat Pictures in one line

Documents
1

Hi,
I have several pictures that belong to one theme. Now I would like the images not to be rendered as a repeating element in a new line, but if there is still enough space on the line, the image should be inserted on the same line.
I am attaching the JSON and the template.
Bilderliste_Template.docx (18.8 KB)
JSON_with_Images.json
Bilderliste_Result.pdf

2

Hello Thomas! I will consult with developers and get back to this case soon.

3

Hello Thomas! I am sorry for making you wait so long. Developers advise to combine pictures as HTML elements and then render them in one row using an accordant formatter. Please check the attached example. You can modify the initial data source JSON in a Power Automate flow before passing it to Plumsail Documents.
JSON_with_Images (2).json (38.5 KB)
html imgs.docx (12.2 KB)

1 Like
4

Hi Evgeniy,
Thank you for your answer.
I have generated the json as a test and customized the template. The result does not fit yet. The images are still displayed one below the other and also distorted in width.
Can you take a look at the html code to see if it fits for rendering. Everything is displayed correctly in the browser with this HTML code.
I have used the following tokens in a table row in the template
Bild zu Mangel-ID {{Mangel-ID}}
{{HTMLBilderZeile}:html}

JSON_Imgages.json (2.4 KB)
Bilderliste (5).pdf (143.9 KB)

5

Hi @t.porstein,

There may still be some limitations related to the HTML formatter and the placement of pictures, depending on their size and style. I'll discuss this further with the developers.

Best regards,
Petr
Plumsail team

6

Hi @t.porstein,

Our developers reviewed the files.

The HTML formatter has limitations, it cannot always convert any HTML markup into the expected document structure.
In this case, it cannot work with div as a web browser, it builds a separate paragraph for each div. Therefore, please try to avoid using nested div, then the pictures will be in a row.

Best regards,
Petr
Plumsail team

7

Hi Petr,
OK, I updated my HTML code and it might work, but the image size in the img tag height=100px doesn't work, so the images are too big to both be displayed in one line. If I then reduce the dimensions in Word, the images are displayed in one line.
Is there a way to set the image to a specific size in the HTML code, like in my code e.g. height=100px
Could you explain, what do you mean with nested divs? Could you give an example?
Here is my actually json-data
JSON_Imgages.json (1.9 KB)

8

Hi @t.porstein,

Try to change height=\"200px\" to height=200px. It should work.

An example of nested DIVs is: <div><div>something here</div></div>". When one div contains another div. However, your last JSON uses DIV for the text under the images. So it won't affect the images.

Best regards,
Petr
Plumsail team

9

Hi Petr,
I have now left out everything superfluous and tried to render the images with html. All images have the same size, although I have specified different heights.
It seems that the information in the img tag is ignored.
Could that be the case? Is there any other solution or workaround?
JSON_Imgages.json (1.4 KB)
Bilderliste (14).pdf (153.6 KB)
Best regards
Thomas

10

Hi @t.porstein,

Try to use this HTML without "px". Like this

[
    {
      "Mangel-ID": 36,
      "HTMLBilderZeile": "<img src=https://wiki.selfhtml.org/images/a/a6/Lauf-1.jpg height=50 width=50><img src=https://wiki.selfhtml.org/images/4/4a/Lauf-2.jpg height=50 width=50>"
    },
    {
      "Mangel-ID": 36,
      "HTMLBilderZeile": "<img src=https://wiki.selfhtml.org/images/a/a6/Lauf-1.jpg height=150 width=150><img src=https://wiki.selfhtml.org/images/4/4a/Lauf-2.jpg height=150 width=150>"
    }
]

image
image882×504 52.3 KB

Best regards,
Petr
Plumsail team