CSS ERROR ON QR IMAGE

[Atlas]

CSS

Show More

.qr-code {
            width:  90;
            height: 90;

HTML

Show More

                
                    <table>

                        <tr>

                            <td colspan="2">

Invoice Information

</td>

                        </tr>

                        <tr>

                            <td>

Invoice Date:

</td>

                            <td>

<<[INVOICE_DATE]>>

</td>

                        </tr>

                        <tr>

                            <td>

Invoice ID:

</td>

                            <td>

<<[INVOICE_ID]>>

</td>

                        </tr>

                        <tr>

                            <td colspan="2">

 <<[QR]>> 

</td>

                        </tr>

                    </table>

RESULT QR SIZE DID’T CHANGED

Show More

Changed CSS and added image functionality

Show More

.qr-code img {
            width:  90;
            height: 90;​

RESULT - NOT READABLE QR

Show More

Changed HTML-wrapped QR image column in image class,

<td style="border:0; vertical-align:top">
                    <table style="float:right;margin:0 0">
                        <tr>
                            <td colspan="2" class="center bold">Invoice Information</td>
                        </tr>
                        <tr>
                            <td>Invoice Date:</td>
                            <td><<[INVOICE_DATE]>></td>
                        </tr>
                        <tr>
                            <td>Invoice ID:</td>
                            <td><<[INVOICE_ID]>></td>
                        </tr>
                        <tr>
<strong>			     <td colspan="2" class="center qr-code">
                            <img src="<<[QR]>>" style="width:90px; height:90px"></strong>
                            </td>                           
                        </tr>
                    </table>

AppSheet is not accepting image column wrapped in a image class

Show More

Show More

I am using an HTML template and the size of the QR code is too big. I have tried using CSS to resize it, but the QR code is not readable. How can I change the size of the QR code in the HTML format without losing the original quality and making it readable? Is it possible to resize the image of the QR code without affecting its readability? All I want is a tiny QR that works.

I would really appreciate any help.

[dbaum]

Maybe you need to generate the QR code at a smaller size to begin with? Services like QuickChart provide a size parameter.

[Atlas]

Hello dbaum, thank you for your suggestion. I used the QuickChart to generate a qr code.

The code below generate a QR code with a specified size.

CONCATENATE("https://quickchart.io/qr?",
"text=",[SALE_INVOICE_LOCATION],
"&dark=",7c0404,
"&margin=",1, 
"&size=",90,)

And the generated URL value from this expression is
https://quickchart.io/qr?text=https://drive.google.com/file/d/1M-CH_oeO22si-***************&dark=7c0404&margin=1&size=90

But when it renders through the HTML script it doesn’t retrive the file id
1M-CH_oeO22si-*************** file

https://quickchart.io/qr?text=https://drive.google.com/file/d/&dark=7c0404&margin=1&size=90

[Atlas]

I have been attempting to generate a QR code for the VC image column using various online sites. All of the sites I tried were able to create the QR image successfully. When I scan these QR codes

using an app, they redirect me to the INVOICE PDF file that has been saved on Google Drive using a bot automation from a HTML file. However, I am unable to access the file from the generated PDF. I have included a picture for reference, which decodes the QR COLUMN image in the PDF file.

Image Charts | Instantly create beautiful charts

chart.apis.google.co

Chart Images from URL | QuickChart

Free Online Barcode Generator: Create Barcodes for Free!

QR decode result from the PDF file

Show More

QR decode result from the APP

Show More

[dbaum]

If you didn’t already, confirm you’re using the right Drive URL syntax for your use case.

[Atlas]

CONCATENATE(“https://drive.google.com/file/d/”,[SALE_INVOICE_ID],“/view”)

From that, I create a QR code.
Here is the URL of the file and text values of QR.

Unfortunately, this QR code doesn’t render the file id in the pdf.