Scale the size of PDF displayed as HTML Link

michal.friedrich · 2024-09-24T08:25:30.147Z

I have an issue with displaying PDFs inside my app.

I have a repeating group which has list of invoices (or whatever documents) and one of them is a PDF attachment.
I have found this awesome way to show them using the HTML object + following HTML Code:

<embed
	src= "here is the link to the pdf"
	type="application/pdf"
	width="100%"
	height="100%"
/>

Result;

But no matter if I use CS classes or use other parameters to scale this - I cannot make this PDF display without sliders. The goal would be to see it as a small miniature so the customer can identify the document type and download only the ones, he sees fit.

Anybody has already found a solution to properly scale it?

I have tried different zoom/width/length commands as well as scale parameters in CSS.
But never I was satisfied with the result.

tunacardak · 2024-09-24T09:56:35.935Z

Do you want a result like this?

Bubble

Bubble Editor - help

Build stuff without code and launch a startup without a tech-cofounder! Bubble is a visual programing language. Instead of typing code, use a visual editor to build applications.

michal.friedrich · 2024-09-24T10:26:24.312Z

Yeah thanks for help.
Actually there should be a dum alert for me as:
I didn’t realize this link leads to png instead of PDF (customers recevie PDFs).
I didn’t realize that this is the link outside of bubble to external service.

And all I needed to adjust was file type to PNG. And now it works like magic!
Thanks man!

tunacardak · 2024-09-24T10:46:17.170Z

I’m glad it worked.

Have a great day