Using Google Sheets with Client Portal

You can embed Google Sheets into Client Portal's content pages. When a change is made, these sheets automatically update.

In this tutorial, we'll show you how to set it up and some changes you can make to improve its appearance.

1

Once you've set up your spreadsheet in Google Sheets, navigate to File → Share → Publish to the Web.

2

Make sure the Embed tab is selected and "Automatically republish when changes are made" is checked. You can also change the other settings for more control over what you would like to embed. When you're happy click the Publish button.

3

Copy the embed code to your clipboard.

4

In Client Portal, set up a module with a Content Page and type /html into the editor to add a custom HTML block. Paste the embed code in this block.

Note: If you are using the Classic editor, make sure the Text tab is selected and paste the iframe code there.

Here's what this will look like:

We need to make some modifications to improve the appearance. Let's go through these below:

Change the dimensions of the spreadsheet

First, we need to change the width and the height. For Client Portal, we recommend the width to be set to 100% but you can also set it to an exact width like 500px. The height will depend on the height of your content. Here's the code you'll need to add before the tag:

width="100%" height="500px"

Now we have this, which is looking much nicer but there are still a couple of changes we can make to improve it even more:

Remove the spreadsheet title and footer

This part is optional depending on your preferences but you can remove the sheet selector bar with the following code which needs to be inserted at the end of your URL:

widget=false

And to remove the title bar showing the spreadsheet name, use the following:

chrome=false

Your embed code should now look something like this:

<iframe src="YOUR-GOOGLE-SHEET-URL/pubhtml?widget=false&amp;headers=false&amp;chrome=false" width="100%" height="300px"></iframe>

Remove the Client Portal sidebar

If your spreadsheet has a large width, you can remove the Client Portal sidebar and display your content page as full width to give you more room.

In the block editor, navigate to the Content Page tab in the right sidebar and turn off the toggle for Display Sidebar. Then, type 100% in the Container Width field.

And here's our finished spreadsheet: