Search code examples
google-apps-scriptgoogle-font-api

Using Google Fonts in Google Apps Scripts


I have seen the past documentation regarding Caja and filtering the use of Google Fonts. There hasn't been any recent action on the web regarding this issue.

Does anyone know of a way to use Google Fonts when creating a templated page via web apps?

I have tried the instructions it provides on the Google api pages but it always defaults to the default font. Other post seem to have been idle for a while and I thought someone might have figured out a way to pull it off.


Solution

  • Simple solution, after I read through some of the documentation (here and here). I did 3 things:

    1. stripped out the body and head tags. That felt very weird but it worked.
    2. changed my sandbox mode to IFRAME in my code.gs file
    3. added the following code to the html template called in the code.gs file

    In code.gs:

    function doGet() {
      var html = HtmlService
      .createTemplateFromFile('index')
      .evaluate()
      .setTitle('Font Test')
      .setSandboxMode(HtmlService.SandboxMode.IFRAME);
      return html;
    }
    

    In index.html file:

    <!DOCTYPE html>
    
      <?// HEAD ?>
        <base target="_top">
        <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Tangerine">
        <style>
          body {
            font-family: 'Tangerine', serif;
            font-size: 48px;
          }
        </style>
    
      <?// BODY ?>
    
        <div>Font Test</div>