Transparent background in Sites Apps Script with HtmlService

Question

There is a similar question in: Google App Script background transparent with HtmlService with no satisfactory answer.

In my situation, I have this simple Apps Script embedded in Google Sites:

CODE.GS

function doGet() {
  return HtmlService.createTemplateFromFile('Page')
    .evaluate().setSandboxMode(HtmlService.SandboxMode.NATIVE);
}

PAGE.HTML

<html>
  <body style="background-color:transparent">
    How do I make it<br/>transparent ?
  </body>
</html>

resulting in a page that looks like this:

https://sites.google.com/site/seanpj01/backtest

Even if the trick of setting

<body style="background-color:transparent">

works if implemented as a straight XML-wrapped gadget, it fails in this situation (I suspect CAJA). There is a discussion on this problem here: http://productforums.google.com/forum/#!topic/sites/KU9nSz37c6U

but again, to no avail. Thanks

contributorpw contributorpw · Accepted Answer · 2014-08-08T14:43:46

Don't use html, head, or body tags

When your page is sanitized by Caja, high-level structural tags are replaced with virtual tags and your markup is inserted into another page created by Caja. For example, an tag is replaced by . Any styles or scripts you attach to these elements are preserved, but the semantic meaning changes.

Because of this behavior, we recommend that you don't use , , or tags in your page and instead just place your styles, scripts, and other HTML content directly in the page. To set the title of your page, use the setTitle() method of HtmlOutput, since tags in your page are ignored.

Instead you may create a gadget for your site. Gadgets can communicate to google apps script over http.

Transparent background in Sites Apps Script with HtmlService

1 Answers