How to embed Google Sheets in WordPress step by step

If you're looking for a way to embed Google Sheets in WordPress, you've come to the right place. Find out the easy way to create a searchable library of spreadsheets and other documents, complete with embedded Google Sheets and Docs.

There are lots of reasons to provide Google spreadsheets to visitors of your WordPress website. For example, you might be providing financial documents or data reports.

Many website owners end up adding basic text links to Google Sheets, which aren't very user-friendly. Others end up manually replicating their Google Sheets in the WordPress editor, which is inefficient and error-prone. Luckily, there's a better way - directly embedding Google Sheets in WordPress! This brings lots of benefits:

In this article, I'm going to cover two methods for embedding Google Sheets in WordPress. First, we'll look at how to embed individual Google Sheets using WordPress' built-in tools. After that, I'll provide a more advanced technique for displaying multiple Google Sheets in a searchable library on your WordPress site. We'll do that using the Document Library Pro plugin, which is ideal for WordPress sites that need to embed large numbers of Google Sheets.

Method 1: Implement Google Sheets with embedded code

If you only need to embed one or two Google Sheets in WordPress, then this method offers everything you need. We'll do it by embedding an iframe containing a Google spreadsheet into any page on your WordPress site.

The iframe method is perfect for embedding individual Google Sheets, one at a time. It's completely free and you don't need any plugins. Instead, it uses Google's "Publish to the web" feature to generate the Google Sheets embed code. You then paste this into WordPress.

Once embedded, the Google Sheet appears directly on your WordPress website wherever you added the iframe code. It's fully synced with Google Sheets and updates in real-time when you update the original sheet. It works with any WordPress site, regardless of your  hosting or theme.

Setup instructions

It's super-simple to embed Google Sheets in WordPress, one by one:

1. Open your Google Sheet and click File → Share → Publish to the web.
   

   

2. In the dialog box, copy the URL from the Link tab.
   

   

3. In WordPress, create or edit a page/post.
4. Add a "Custom HTML" block and paste the following code snippet. Replace [spreadsheet link] with the Link you copied in step 2:

<div style="width: 100%; overflow-x: auto;">
<iframe src="[spreadsheet link]?widget=true&amp;headers=false"
width="1000" height="600" style="border: none;">
</iframe>
</div>

Preview/publish your page to see the embedded spreadsheet. (Note that the embedded Google Sheet may not render accurately in the editor preview. However, it will look fine on the front end of your WordPress site.)

Limitations

The main limitation of this method is that used alone, it's only suitable for displaying small numbers of Google Sheets. That's because each one is embedded directly on the page, which would become difficult to navigate if you add many. As a result, you should use Method 2 if you have lots of Google Sheets to embed in WordPress.

Method 2: Implement advanced spreadsheet libraries with Document Library Pro

Document Library Pro is the professional solution for embedding multiple Google Sheets in WordPress. It brings lots of benefits compared to pasting iframes into pages individually:

• Searchable spreadsheet libraries: Display large numbers of spreadsheets (or any other type of document) in a searchable, filterable library. This helps people to find specific spreadsheets quickly and easily. They can then click on their chosen spreadsheet to either view it on Google or access a page on your site to view the embedded Google Sheet.
• Multiple ways to add Google Sheets: Either embed each spreadsheet in WordPress individually, or in bulk by importing a CSV file.
• Automatic synchronization: Use Zapier to automatically sync new documents from Google Drive and other sources.
• Customizable layouts: Display documents in a searchable table or a flexible grid layout, both fully responsive and customizable.
• Advanced search and filtering: Built-in instant AJAX search, filter dropdowns, and sortable columns for easy navigation.
• Access control: Restrict access to documents by user role or password.
• Download tracking: Track downloads with built-in counters and Conversion Bridge integration.

How Document Library Pro outperforms basic Google Sheet embedding

Document Library Pro is a far better way to display Google Sheets in WordPress because it's designed for making large numbers of spreadsheets easy to find. Instead of listing them one-by-one, it displays them in a structured spreadsheet library. As well as supporting embedded Google Sheets, you can add buttons linking to the Google Sheet to give users a choice.

For example, Albury Parish Council used Document Library Pro to create a searchable document database. It includes both spreadsheets and other types of data. Each document or Google Sheet is available via a direct link:

As György Keresztes said in their Trustpilot review:

Simply the best Document Library out there nowadays for a WordPress site. I'm a proud customer of this product.

Next, I'll show you how to create a searchable Google Sheets library complete with embedded spreadsheets. For full instructions on setting up Document Library Pro, see our guide on how to use WordPress for effective document management.

Setup instructions

Use this tutorial to add spreadsheets to your Google Sheets library one by one. To do it in bulk, follow the documentation on importing documents instead:

1. First, go to your Google Sheet and go to File → Publish to Web and copy the 'Link' provided to your clipboard. It should look something like this: https://docs.google.com/spreadsheets/d/e/2PACX-1vRtM_8dpwuiNhBDc1thmtklEMov8m-j5S7WsjgIBdywI-lOfHz3IOFvTKq27MoPj--I06d8056wKiL0/pubhtml
2. Install Document Library Pro on your WordPress site.
3. Go to Documents → Add New.
4. Add the document title and any other information about it.
5. To include a link to the spreadsheet, use the File section on the right to select "File URL" and then enter the URL of the Google Sheet. (Make sure its sharing settings are set to public, first.)
6. Now go to the 'Code' tab in the main content area, and paste the following code snippet, replacing [spreadsheet link] with the Link you copied in step 1:

<div style="width: 100%; overflow-x: auto;">
<iframe src="[spreadsheet link]?widget=true&amp;headers=false"
width="1000" height="600" style="border: none;">
</iframe>
</div>

Now use the 'View Document' link at the top of the page to view the embedded Google Sheet in the front end. It will look something like this:

In the above code snippet, we set the width to 1,000 pixels and the height to 600 pixels, with a horizontal scrollbar for bigger sheets. Feel free to change the sizes as needed to fit your theme.

View the main document library page

Finally, you need to check how the Google Sheet looks on your main document library page:

1. Go to Pages in the WordPress admin and find the page called "Document Library". (You can rename this as needed, e.g. to "Financial Documents".
2. View the page.
3. You'll see all your documents (i.e. spreadsheets in this case) displayed in a searchable library. If you included a 'Content' column in the library then the embedded Google sheet will appear on the main library page. If not, people can click on each one to view the page containing the embedded spreadsheet.

In the following screenshot, the first row of the table includes a spreadsheet with the Google Sheet embedded directly. As you can see, this doesn't allow much space. If your spreadsheets are big like this, then it might be better to not include them on the main library page. Instead, you can link to the page containing the embedded Google Sheet.

Troubleshooting

There aren't many things that are likely to go wrong when you embed Google Sheets in WordPress. Here are tips on solving the most common problems in case a Google Sheet isn't embedding correctly:

• Check the spreadsheet's Sharing settings: Make sure the Google Sheet embed isn't set to "Restricted" (only people with access can view). To do this, go to your Google Doc and navigate to File → Share → Publish to Web, then open the 'Published content and settings' section. Make sure the document isn't restricted to specific people only.
• The embedded spreadsheet isn't responsive: Due to a limitation in Google Sheets, it's not possible to make the embedded spreadsheet responsive. The content of the original spreadsheet isn't responsive either! Instead, we included a horizontal scrollbar in the code snippets provided above. This allows users to scroll left and right within the embedded Google Sheet.
• Check your WordPress theme: Most WordPress themes are fine with embedded Google Sheets and other documents. However, if you're experiencing responsive issues then this is probably due to poor coding in your theme. For example, some themes don't know how to size embedded docs correctly within the content area, which may cause problems such as overlapping or responsive issues. To solve this, either send a support request to the theme company, or request a quote from our customization service if it's a custom WordPress theme.

Document Library Pro: The better way to display Google Sheets (and more!) in WordPress

As you can see, Document Library Pro is the best way to embed Google Sheets in WordPress. Instead of just embedded spreadsheets individually, it creates an interactive library where users can easily find the spreadsheets they want. Once they've found a Google Sheet, they can either access it directly or click through to a page where you have embedded it.

And it doesn't stop there! Document Library Pro can do much more than just embed Google Sheets in WordPress. It works with any type of document or resource including Google Docs, Dropbox, OneDrive). Use it to create a centralized document hub for your organization. It will scale with your business, making it a smart long-term investment.