Google Docs is a very flexible word processor in many ways, but many people don’t realize that you can embed HTML in a Google Doc.
There are several ways to do this. One is to actually copy the HTML document straight from the browser and paste it into Google Doc. Another is a trick using the importHTML function in Google Sheets to customize HTML formatting, which can then be embedded in a Google document.
Include HTML Page in Google Document
If you are writing a document that requires information from the Internet, the last thing you need to do is paste that information as text.
This is due to the fact that most of the information on the Internet contains information such as charts, graphs, images, and more. For example, taking notes to research an article for an essay would be much easier if you could embed HTML into a google document from a web page.
Fortunately, doing this in Google Docs is very easy. This is made easier by the fact that Google Docs automatically inserts the inserted web pages to maximize the original formatting.
- Highlight the section of the web page that you want to embed in your document. Press Ctrl-C on your keyboard to copy this section.
The example above shows the process of copying and pasting a section of a page from Wikipedia.
- Then open the Google document in which you want to embed this HTML page, right-click and select Paste. Be sure to select Paste and not Paste Without Formatting.
- When you select Paste, Google Docs will automatically import the copied section of the page as much as possible in the same format as it appears on the original page. This includes images, URL links, and headers.
You can see the links are active by hovering over them. An external link appears in Google Docs.
You may find that in some cases the formatting of the image (for example, alignment on the page) does not match the original page you copied from.
You can fix this by selecting the image, clicking the left align text icon on the ribbon, and the text wrap icon below the image.
This should look more like the original formatting of the web page. If the image has a caption, you may need to move it below the image or to another location that you deem appropriate.
As you can see, embedding HTML into a Google document using copy and paste from the web is not ideal. But it is the fastest way to transfer information while preserving as much of the original HTML formatting of the web page as possible.
Include HTML in Google Document using importHtml
Another method of embedding HTML into your Google Doc is to embed HTML in Google Sheets using the importHtml function. Then you can paste this into Google Docs.
Keep in mind that instead of embedding a section of a page, this function will embed the entire page. However, there is a way to work around this by using the index number in the function syntax to import only a table or list from the page.
For example, let’s say you want to embed the fourth table from the Wikipedia web page on US demographic data. First, open a new Google Sheets spreadsheet. In the first cell of the spreadsheet, enter the function:
= ImportHTML (“https://en.wikipedia.org/wiki/Demographics_of_the_United_States”, “table”, 4)
When you hit Enter, this will import the fourth table from the web page and insert it into the table where your cursor is.
You now have imported HTML data that you can use to embed in Google Docs. Format this spreadsheet the way you want it to be viewed in Google Docs.
- To do this, select the spreadsheet in Google Sheets and press Ctrl-C to copy the spreadsheet.
- Position your cursor in the Google Docs document where you want to place the spreadsheet, right-click and select Paste.
- You will see a pop-up window with several options. Select “Link to Table” and click the “Insert” button.
This will insert the spreadsheet from Google Sheets into Google Docs as it was originally formatted.
By linking a spreadsheet, you can always update the spreadsheet in Google Sheets, and it will automatically update the spreadsheet in Google Docs.
Embed HTML in Google Docs with Word
If you have a simple HTML saved in a .html or .htm file, you can open it in Microsoft Word first. Word always tries to display the HTML file. Then you can import this document into Google Docs and copy the entire page or section of the page into the document you are editing.
- To do this, open Microsoft Word and open your HTML file. You should see the file as it would appear in a browser.
- Save this document in Word format.
- Then go back to Google Drive and upload the file to your Google Drive account.
- Once downloaded, right-click it, select Open With, and select Google Docs.
This will open a Google Docs document formatted as close to HTML rendering as possible.
Now you can copy either the entire HTML file or just the section you want. Then paste it into the Google Docs document you are editing.
These are three ways to embed HTML into a Google document. The option you choose depends on what tools you have. It also depends on whether you want the entire page or just a section of it, and how closely you need to match the original HTML rendering formatting.