Answered

PowerApps HTML/Image Exporting/Email

(0) Share

Report

Posted on by JB-10102051-0

Long and Short story, had a Powerapp which used Power Automate to grab photo convert to base64 code and insert it along with bits from powerapps as inputs and send an email. New Security policy in our organization are causing issues with this process. So to align with their needs I need to move everything into PowerApps with the outlook connector.

I have successfully passed the image and the text through the email, however now even though the text is aligned in powerapps on the photo, it appears below it in outlook. Any ideas on how to correct this and pass the background color through? I am using a random RGB value to allow the user to change until they like a color they see and on submission i pass that value through currently as Hex code with JSON into the HTML which again, shows in PowerApps fine, does not show at all in Email.

Updated to include a screenshot of the code.

Categories:

General Questions

Image details.JPG

All responses (8)

Answers (1)

Verified answer

JB-10102051-0 23 on at

Like (0)

Report

Re: PowerApps HTML/Image Exporting/Email

I found a solution last night, the experimental PDF which works even better than what I was trying to accomplish.
Tony_Bowes_BP 280 on at

Like (0)

Report

Re: PowerApps HTML/Image Exporting/Email

Yes, very likely HTML formatting issue. If you post the actual HTML body of both sets of emails I can look at them for a likely difference. Feel free to redact any sensitive info, but leave as much of the HTML intact.
JB-10102051-0 23 on at

Like (0)

Report

Re: PowerApps HTML/Image Exporting/Email

I guess what I am after is someone who can help resolve this, I have tried about 100 different ways to go about this, It looks good in HTML, it looks good in HTMLText control in powerapps, but no matter the email client it comes out with the text below the image instead of on top of it. My best attempt passed the hex code background color through and a single line of text in the middle of that rectangle but the image would never load. I guess its more of an HTML and outlook client issue than a powerapps one. Although I do find that nothing online will allow me to pass HTML as an attachment in powerapps, sure if I use a file upload, but the end user isnt expected to upload anything, I need 3 things from them, a to person, a reason, and the color of the image they are sending and then its sent.

Image 1.JPG

Image 2.JPG
Tony_Bowes_BP 280 on at

Like (0)

Report

Re: PowerApps HTML/Image Exporting/Email

I'm saying the focus should be on the output, not the method of generation. The output in this case is an email, so find an email with the desired output (or even build it by hand). Once you know exactly what the HTML should be, then work backwards in creating the code to generate the output. Eventually, once you have a working prototype, look at making it generic to handle the various dynamic data.

Since you already have similar code in power automate that can produce the desired output, focus on the email that comes out from an example set of data, and then look at an email generated from your current code with the exact same example data (even if you have to hard-code the values). Whatever is different in the email's HTML is likely what's causing the issue. It may not even be anything to do with the HTML snippet you're working on, but there should definitely be a difference because expected result (the output) is different.
JB-10102051-0 23 on at

Like (0)

Report

Re: PowerApps HTML/Image Exporting/Email

Sort of, the email texted are 100% unique every time they are sent out, what you describe sounds like using power automate, which I cant use in this case, I know Outlook is the worst for html formatted emails but looking at it from another perspective, how could I go about attaching this htmltext control as an html file attachment to the email? I have used it with the attachment connector many times but thats the end user uploading a file. In this case I just want the created content sent out.
Tony_Bowes_BP 280 on at

Like (0)

Report

Re: PowerApps HTML/Image Exporting/Email

.. so you should be able to create a target email and look at the HTML body of the received email, then compare against the HTML sent out from Power Apps. My gut feel is that there are additional CSS elements interacting with the original one.
JB-10102051-0 23 on at

Like (0)

Report
Re: PowerApps HTML/Image Exporting/Email

I have the code the way I wanted it in Power Automate, its not working when removing this process and trying to only use Power Apps.
<div class="WordSection1"> <div style="position: absolute; text-align: center;"><img src=@{triggerBody()['text_6']} alt="Bravo Card" style="width: 800px; height: auto; opacity: 1;background-color: @{triggerBody()['text_4']}" /> <div style="position: absolute; top: 56.5%; left: 16%; font-size: 18px; width: 550px; line-height: 1.8; text-align: left; font-family: verdana;">@{triggerBody()['text_1']}</div> <div style="position: absolute; top: 49%; left: 22%; font-size: 32px;font-family: ' verdana', cursive;">@{triggerBody()['text']}</div> <div style="position: absolute; top: 50%; right: 14.5%; font-size: 16px; font-family: verdana;">@{body('Convert_time_zone')}</div> <div style="position: absolute; bottom: 22%; left: 64%; font-size: 20px; font-family: ' verdana', cursive;">@{triggerBody()['text_2']}</div> </div> <p class="MsoNormal"></p> <p class="MsoNormal"><o:p> </o:p></p> </div>
Tony_Bowes_BP 280 on at

Like (0)

Report

Re: PowerApps HTML/Image Exporting/Email

Since you are primarily wanting an email with a specific look & feel, start with a target email and work backwards.
You might want to use email formatting tools such as: Email Markup Tester (google.com) to help get the format right.