Adding media content to your website is a great way to give your readers additional information and resources. But if you are using Google Docs or Google Sheets data, then you may want to embed that content to your WordPress site in a post or page.
While much of the media that you might embed would be an image or a video, you may find yourself looking to display a spreadsheet on a Web page as well. Your first thought might be to simply copy that information and paste it on your Web page, but you may have seen someone else with an embedded Google file and thought that it might be a good option for oyur site, too.
If you are a WordPress user, then embedding a Google Sheets file on one of your posts can be accomplished using the “Publish to the Web” feature of Google Sheets in conjunction with the “Custom HTML” block in the WordPress editor.
How to Embed Google Sheet in WordPress
- Open your Sheets file.
- Click File, then Publish to Web.
- Select Embed.
- Choose what to embed, then click Publish.
- Click OK.
- Copy the embed code.
- Open your WordPress post.
- Create a Custom HTML block.
- Paste the copied code.
Our article continues below with additional information on embedding a Google Sheets file into a WordPress post, including pictures of these steps.
How to Embed a Google Spreadsheet In a WordPress Post (Guide with Pictures)
The steps in this article were performed in the Google Chrome Web browser. This guide assumes that you are able to sign into the admin section of a WordPress site and create or edit posts or pages.
Use these steps to embed a Google Sheets spreadsheet in WordPress.
Sign into Google Drive and open the Sheets file.
You can go to https://drive.google.com to view your files.
Select the “File” tab at the top of the window, then choose “Publish to the Web.”
Choose the “Embed” tab.
Click the “Entire Document” dropdown menu and choose whether to embed the entire file or just one sheet, then click “Publish.”
Click “OK” to confirm that you want to publish it to the Web.
Press “Ctrl + C” on your keyboard to copy the embed code.
Navigate to your WordPress admin panel and create a new post or open an existing one.
Click the + button to create a new block, then choose the “Custom HTML” block.
If it’s not in the commonly used blocks at the top of the list, you can find it in the “Formatting” section.
Press “Ctrl + V” to paste the embed code you copied earlier. You can then click “Publish” or “Update” to make the post live.
How to Resize the Google Sheets File in Your WordPress Post or Page
Often the embedded iframe will be very small, so you may need to adjust its size. You can do this by adding a width and height to the frame. For example, an iframe with a height of 500 pixels and a width of 300 pixels would have a code like this:
<iframe width=500 height=300 src="https://docs.google.com/spreadsheets/d/e/xxxxxx/pubhtml?gid=0&single=true&widget=true&headers=false"></iframe>
Note that by embedding your spreadsheet in this manner you need to make it public so that it can be viewed by people that visit your Web page.
If you wish to stop publishing the spreadsheet to the Web, you can do so by going back to the File > Publish to the Web menu in Google Sheets, then clicking the “Stop Publishing” button.
- How to merge cells in Google Sheets
- How to wrap text in Google Sheets
- How to alphabetize in Google Sheets
- How to subtract in Google Sheets
- How to change row height in Google Sheets
Matthew Burleigh has been writing tech tutorials since 2008. His writing has appeared on dozens of different websites and been read over 50 million times.
After receiving his Bachelor’s and Master’s degrees in Computer Science he spent several years working in IT management for small businesses. However, he now works full time writing content online and creating websites.
His main writing topics include iPhones, Microsoft Office, Google Apps, Android, and Photoshop, but he has also written about many other tech topics as well.
Disclaimer: Most of the pages on the internet include affiliate links, including some on this site.