Automate Google Docs formatting using Apps Script

Photo by Susan Q Yin on Unsplash

Automate Google Docs formatting using Apps Script

Let’s say your company maintains some contents in a google doc and the doc have your company logo in the header. The company decides to change their logo so now you are tasked with changing the logo in the header of the doc. It’s a super easy task, right?

Just open the doc in the browser, delete previous logo image from the header and insert the brand new logo and you are done. Now let’s go home and catch up on the latest One Piece episodes 🤩.

tumblr_m41jrgBcwv1rs64k3o2_250.gif

But before you head out to your home, you are instructed to do the same for all the doc files (around 100 files) in a drive folder 😬. Of course you can repeat the above process for all the files and forget about catching up on latest One Piece’s episode today or tomorrow 🥲.

Well, fear not my nakamas I am here to safely sail you through this tedious task of yours by automating the whole process using, you guessed it right, Apps Script.

luffy_jinbei.png

To achieve this we need to do two things:

  1. Iterate through all the files of the given folder and get the file IDs
  2. Update the logo for all the doc files in the folder

Let’s get started.!!

First off all, let’s create an Apps Script project. Go to https://script.google.com/ and create a new Project and rename it. I renamed it as Automate My Work because that’s exactly what we want it to do 😁.

After creating the project, go to code.gs where we have an empty function named myFunction. We will be adding our script there.

  1. Iterate through all the files of the given folder and get the file IDs

    You can access your drive folders and files using DriveApp service.

    You can get the FOLDER_ID from the url when you open the folder in the browser

folder_id.png

```jsx
// get the folder
const folder = DriveApp.getFolderById(FOLDER_ID);
// get all Doc files in the folder
const files = folder.getFilesByType(MimeType.GOOGLE_DOCS);

// iterate through the files
while (files.hasNext()) {
  const file = files.next();
  const fileId = file.getId();
  Logger.log(fileId);
}
```

Above code logs IDs of all the Google Docs files in the give folder.
  1. Update the logo for all the doc files in the folder

    Access the doc using built-in DocumentApp service by passing doc ID as an argument

    FILE_ID is the fileId we obtained in the previous step

     // access doc using the doc ID
     const doc = DocumentApp.openById(FILE_ID);
    

    Then get the logo image from the header and remove it

     // get doc header where the logo is
     const docHeader = doc.getHeader();
    
     // get the first paragraph which contains the logo (maybe different in your case)
     const paragraph = docHeader.getParagraphs()[0];
    
     // first child of the paragraph is our logo image (maybe different in your case)
     const oldLogo = paragraph.getChild(0).asInlineImage();
    
     // get height and width of current logo
     const height = oldLogo.getHeight();
     const width = oldLogo.getWidth();
    
     // remove the old logo image
     paragraph.removeChild(oldLogo);
    

Now get the new logo from the drive folder and apply it to the header

// get the new logo as a blob
const newLogo = folder.getFilesByName('new-logo.png').next().getAs('image/png');

// apply the new logo image to the header in place of the old logo
paragraph.insertInlineImage(0, newLogo).setHeight(height).setWidth(width);

// Note: if you want to apply different dimension for the image then just
// replace `**height**` and `**width**` with some numerical value
// paragraph.insertInlineImage(0, newLogo).setHeight(100).setWidth(200);

Now let’s merge script from both steps to create our final script. The final code should look like following:

function myFunction() {
  // get the folder
    const folder = DriveApp.getFolderById(FOLDER_ID);
  // get all Doc files in the folder
  const files = folder.getFilesByType(MimeType.GOOGLE_DOCS);

  // iterate through the files
  while (files.hasNext()) {
    const file = files.next();
    const fileId = file.getId();

    // get the doc from id
    const doc = DocumentApp.openById(fileId);

    // get doc header where the logo is
    const docHeader = doc.getHeader();

    // get the first paragraph which contains the logo
    const paragraph = docHeader.getParagraphs()[0];

    // first child of the paragraph is our logo image
    const oldLogo = paragraph.getChild(0).asInlineImage();

    // get height and width of current logo
    const height = oldLogo.getHeight();
    const width = oldLogo.getWidth();

    // remove the old logo image
    paragraph.removeChild(oldLogo);

    // get the new logo as a blob
    const newLogo = folder.getFilesByName('new-logo.png').next().getAs('image/png');

    // apply the new logo image to the header in place of the old logo
    paragraph.insertInlineImage(0, newLogo).setHeight(height).setWidth(width);
  }
}

Now, let’s run this script, sit back and relax as the files are being updated with new logo. 😎

Before running script

Screen Shot 2022-04-03 at 6.24.33 PM.png

After running script

Screen Shot 2022-04-03 at 6.23.56 PM.png

You can create similar script to perform other reformatting tasks like changing page orientation, changing font-family or anything that Google APIs have to offer.

You can checkout official site for more info on Apps Script docs and Docs API.

Happy Coding.!! 🙂