Google-docs – How to change the size of an embedded Google Docs document

embedgoogle docsiframe

Preamble

By embedding a Google Docs document into a web page using the provided iFrame data

<iframe src="https://docs.google.com/document/d/e/your_google_doc_id/pub?embedded=true"></iframe>

the document will be displayed. Adding the width and height parameters change the size of the iFrame.

Problem

When changing the size of the iFrame the Google Doc changes its size as well. So instead of being displayed as the usual A4 paper (like in the editor) its width will be reduced. This can be a hassle when working with small spaces, because the formatting is really weird:

  • Images as well as tables are still as wide as in the original document
  • The padding from the original document is also kept
  • All normal text will now be squished

Question

Is there any way to add a parameter to the iFrame or style it with css so that the embedded document will always stay at "A4-size" no matter the size of the iFrame itself? Please understand that in my case it won't be possible to make the iFrame itself bigger.

Or is there something that can be added to the src-URL?

Best Answer

The URL shown on the question is using /pub. This means that the Google Document was published. I think that it's fair to assume that you published it as HTML and this setting, at least for Google Documents, hasn't "something that can be added to the src-URL" to show the document as A4 page sized document.

One alternative is that you publish your document as PDF or change the the /pub URL for the "export as PDF" URL. (See the corresponding related question)

Another alternative is that you embed the original document rather than the published / exported version.

One more alternative is that you manually copy or get the source code of the published document by using some programming language, maybe JavaScript, to modify it to fit your needs.

Related