Back to Project
Getting Started
- How to install Client Portal
- Can I use it without WordPress?
- Setting up your first portal
- Using content pages
- Questionnaires with Contact Form 7
- Importing and Exporting Portals
- Icon Cheatsheet
Customisation
- How do I edit 'Phase 1, 2, 3' text?
- Customise project status modules
- Remove the project status modules
- How to change the fonts in Client Portal?
- How do I make a portal public?
- How to change the 'Client Portal Archive' text
- How to change the "Client Portal Login" text on the login page
- Change Error Message on the Login Screen
- How do I add or move Phases
- How do I redirect clients to the homepage after logged out
- What is the Legacy theme?
Troubleshooting
- I’m not getting Client Portal updates.
- Client Portal isn’t working.
- I can't find my Client Portal Login page!
- I'm getting a 404 error message
- Nginx error message
- I can't log into a portal
Security
- Are my files safe in Client Portal?
- How do I hide Client Portal from search results?
- Private File Uploads
Users & roles
- Can I assign a client a different role?
- How can I assign multiple users to Client Portal?
- How do I add a new user to Client Portal?
Working with Client Portal
- Introducing Client Portal to your clients
- How clients can mark as complete
- Accepting file uploads with Contact Form 7
- Accepting file uploads with Gravity Forms
- Create a to-do list with Google Sheets
- Accepting file uploads in Client Portal
Integrations
Using Google Sheets with Client Portal
You can embed Google Sheets into Client Portal's content pages. These sheets will automatically update any time a change is made.
In this tutorial, we'll go through how to set it up and some changes you can make to improve the appearance.
- 1
- Once you've set up your spreadsheet in Google Sheets, navigate to File -> Publish to the Web.
- 2
- Make sure the Embed tab is selected and copy the iframe code. You can also change the other settings here to only embed single sheets or the entire document.
- 3
- In Client Portal, set up a module with a Content Page, make sure the Text tab is selected and paste in the iframe code.
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 700px to display correctly. The height can be whatever you like (and will depend on the height of your content). Here's the code you'll need to add before the tag:
width="700px" height="1000px"
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:
Here's the final embed code that you can use with all these changes applied. Just replace your spreadsheet URL (which is this part: https://docs.google.com/spreadsheets/d/e/2PACX-1vR1n3r11t2sKuRGHLS99-UMbfeKZzty31WunH-KNzCA1-cRALHUb_m5NdcqU4e5oNBJw2J-talGkc-M) with your own.
See the Pen
Google Sheets in Client Portal by Laura Elizabeth (@laurium)
on CodePen.
And here's our finished spreadsheet:
