How can I adjust the size of an embedded Google Sheets on Webflow?

Published on
September 22, 2023

To adjust the size of an embedded Google Sheets on Webflow, you can follow these steps:

  1. Log in to your Google account and open the Google Sheets document you want to embed.

  2. Click on "File" in the top menu and select "Publish to the web" from the dropdown menu.

  3. In the new window that opens, click on the "Embed" tab.

  4. To adjust the size of the embedded Google Sheets, you can specify the dimensions directly in the "Embed code" box. The code should look something like <iframe src="https://docs.google.com/spreadsheets/..."></iframe>. Add the width and height attributes to the iframe tag, like this: <iframe src="https://docs.google.com/spreadsheets/..." width="500" height="300"></iframe>. Replace the "500" and "300" with the desired values for width and height.

  5. Copy the modified code.

  6. Go to your Webflow project and navigate to the page where you want to embed the Google Sheets.

  7. Add an Embed element to the section or container where you want to place the spreadsheet. You can find the Embed element in the Add panel.

  8. Double-click the Embed element to open its settings and paste the modified Google Sheets embed code into the "Embed code" input.

  9. Save and publish your Webflow project.

By following these steps, you should be able to adjust the size of an embedded Google Sheets on Webflow to fit your needs.

Additional questions:

  1. How do I embed a Google Sheets document on Webflow?
  2. Can I customize the design of an embedded Google Sheets on Webflow?
  3. What other types of content can I embed on Webflow?