'Embed Google Form in Gmail using Apps Script

I'm trying to use Apps script to embed a prefilled Form in an email. The emails will only be sent to Gmail users. I want something that works the same as pressing the 'include form in email' option when manually emailing a form.

I've successfully created the prefilledUrl and used UrlFetchApp and HtmlService to get the Html from the form and send email.

But when it arrives it looks like the screenshot below and user can not submit. Screenshot of form embedded in email

A stripped down version of the code I am using is the following:

var prefilledForm = 'prefilledForm link here');
Logger.log(prefilledForm);

var subject = 'Message from Office';
var response = UrlFetchApp.fetch(prefilledForm);
var htmlBody = HtmlService.createHtmlOutput(response).getContent();

var body = 'Dear '+mName+',\n\n'+mMessage+'\nPlease acknowledge by submitting the form below.\nRegards,\nSchool Office';

GmailApp.sendEmail(eEmail,subject,body,{
  noReply:true,
  htmlBody: htmlBody
});

Is there anyway to embed the form in an email just like it does when you select 'include form in email' like the screenshot below?

enter image description here



Solution 1:[1]

  1. Send the form to yourself with the form included in the email.
  2. Open Gmail in the browser, press F12. Find the div of the form in the email body. enter image description here
  3. Paste the div code to the body of the Apps Script HTML file. Or paste it to email HTML body in your script, I didn't test it. enter image description here
  4. Send the email with the above HTML file, you should be able to get a similar result as below. enter image description here

Solution 2:[2]

I found workaround to allow to do it without need of manual attention. After point 3rd in Ashton Fei's response replace all instances of Title, description and link url with desired values using getCode() and replace():

  var formUrl = form.getPublishedUrl()
  var template = HtmlService.createTemplateFromFile("form.html").getCode(); // HTML code to string
  template = template.replaceAll("FORM__URL", formUrl).replace("TITLE", title).replace("Descpition_text", desctiptionText); //Swapping bits that need change
  var htmlBody = eval(template).getContent() //"Go back to HTML"

Now you can use this HTML as you email htmlBody

Solution 3:[3]

This seemed to work for me:

  1. email the form embedded to yourself
  2. Click "Forward" and modify the email the way you want it (you can remove and add things like logo, etc.)
  3. Click "Save as a template" and give it a name (make email "Full Screen" and click on the three dots in the lower righthand corner)

When you want to send it to a client, click "compose" (full screen), maximize the email window, click on the three dots (explained above)and chose the template you created.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Ashton Fei
Solution 2 polomolo
Solution 3 Alexander Boemark