Magazine

5 Easy Ways To Embed Google Docs in WordPress (Beginner’s Guide)

Posted on the 24 February 2021 by Nirmalkumar1997

WordPress is one of the most popular platforms that has quickly outgrown its initial purpose. It was created as a blogging platform. Thanks to its flexibility, now people use WordPress to develop websites of any kind.

It has countless themes and plugins to quickly adjust your website’s look and functionality to your needs.

Whether you need a landing page for your business or want to start an eCommerce store, WordPress is always the right solution.

This platform has proven to be convenient, reliable, and perfect for customization. However, you might still experience specific problems with it. For example, WordPress can have problems with integration.

If you want to integrate it with other platforms or services, you should know how to do it properly. Many business owners have to create a lot of content all the time.

Therefore, one of the most common issues is using WordPress with Google Docs.

Google Docs is extremely popular among content creators because it is a perfect collaboration solution. Different people can work on the same document, editing it, adding comments, and access it from any device.

However, when you need to move content from Google Docs to WordPress, your formatting might suffer.

Many WordPress publishers realize that working with Google Docs is too complicated, so we decided to help you with some useful tips. But first, let’s think of why you should use Google Docs in the first place.

Why Google Docs Is Better Than The WordPress Editor (Advantages)

Google Docs provides a better writing experience in almost every aspect. There are many reasons why people choose Google Docs instead of the regular WordPress editor. We are going to highlight the important ones in this section.

  • You won’t lose your work
    On the one hand, WordPress has an autosave function. On the other hand, Google Docs is much more effective because your changes to a document will be saved even if you close the browser window. The same will happen if you lose the internet connection. In WordPress, the autosave function isn’t instant. By default, it takes about 60 seconds to save your changes.

Of course, you can dig into code and try to adjust it to your preferences, but not everyone is good at coding.

Besides, if you think that 60 seconds are not a big deal, the truth is that sometimes, a lot can happen in 60 seconds, and you cannot afford to wait for so long. Besides, sometimes, the WordPress autosave function doesn’t work at all.

  • Simple comments
    When creating content, drafts are often filled with comments like “add a link here” or “rewrite it to make it easier to read.” When using Google docs, you can add comments easily and quickly. Different people who have access to a document can add their comments, edit them, and make sure that a new version addresses previous suggestions.
  • Collaboration
    If you’re a blogger, the chances are that you don’t care about collaboration at all. However, if you own a business website, this issue becomes critical because many people are involved in the content creation process. Google Docs makes collaboration more comfortable than ever. You don’t even need to wait until your draft is finished to share it with others. Several people can edit one document at the same time, seeing all the changes in real-time.

Problems With WordPress and Google Docs

As you can see, Google Docs is undoubtedly an excellent solution for everyone who needs web content. However, working with Google Docs also has a downside: when you need to get your content into WordPress, things can get messy.

Let’s say your writer writes an article for your website. They prepare a draft and send you a link to Google Docs so that you can approve it or suggest any changes.

After this, you might want to simply copy the content from the Google Docs documents and paste it into the WordPress editor. This is where the problems start because such a simple solution will lead to numerous formatting issues.

Most people notice that WordPress adds unnecessary line breaks between paragraphs, even though they’re only one line break in Google Docs. However, this is not the only problem.

If you check out the code view of the text itself, you will see lines with unnecessary code that have been added by WordPress for some reason. It might seem that extra line breaks can be added by merely using &nbsp.

However, when you copy your content from Google Docs, you get something like this:

<span style="font-weight: 400;"> </span>

If the document has listed in it, WordPress will also add font-weight styles to the lists, as well:

<li style="font-weight: 400;">

As you can see, WordPress turns your code into a mess. On the one hand, you cannot ignore it. On the other hand, editing a long document manually will take too much time and effort.

You might remove extra line breaks by simply pressing backspace dozens of times.

However, you will still have to do something with the underlying code. Besides, the unnecessary HTML code might increase your page’s total weight and therefore affect your performance.

Consequently, it’s essential to find a way to transfer your content from Google Docs to WordPress more efficiently.

How To Embed Google Docs in WordPress?

Now, let’s see the methods we recommend to embed Google Docs in WordPress!

Using The Google Doc Embedder Plugin

The easiest way to use Google Docs with WordPress is to install the EmbedPress WordPress plugin. We have a dedicated guide on installing WordPress plugins.

Download it from the official WordPress website and follow these easy steps:

  • Open your WordPress dashboard, then go to “Plugins,” and click “Add New.”

add new wordpress plugin

  • To find the necessary plugin, type “EmbedPress” in the search box.

embedpress wordpress plugin

  • After this, you need to click “Install Now,” and the plugin will be installed.

install embedpress plugin

  • Once the plugin is installed, you also need to activate it. The button “Install Now” will change into “Activate.” Activate the plugin, and it will start working.

activate embedpress plugin

Now that you have the plugin installed, you can start using it to add content from your Google Docs to WordPress.

  • First, go to “Pages” and choose a page where you want to upload the document you need to.

sample page

In this case, we will be using the sample page we have created. Open it and search for the Google Docs block.

google docs block

The block will ask you for a Google Docs URL.

google docs url

You need to log in to your Google Docs account, get the public link.

publish to web link

Paste the link inside your block and save it.

embed docs

It will give you a live preview there. Once you have published or updated the page, you can see the embedded Google Docs file in your frontend.

embed the docs

As you can see, the plugin method is pretty simple. Now, let’s check out the next plan we have for you.

Via Google Drive

When you need to embed a Google Docs document, you can do it from Google Drive.

  • Select the document and then click “File.” Click “Publish to the web.”

publish docs to web

  • Then select “Embed”> “Publish.”

pubish embed code

  • You will see a dialogue box asking you whether you want to publish your selection. Click “OK.”
  • After this, you will see the embed code on the “Embed” tab. Select the code and copy it.

copy embed docs code

  • Log in to your WordPress website and click “Pages.” This can even be a post or a custom post type. That’s totally according to your usage.
  • Select the page where you want to embed your Google Docs document.
  • Go to the “HTML” option.

wordpress text editor

  • Insert the embed code that you’ve copied before and clicked “Publish.”

paste wmbed iframe code

  • After this, your Google Doc will appear on the page.

You are done!

Embedding Google Docs Using Gutenberg Block Editor

WordPress 5.0 comes with a new editor — Gutenberg Block Editor. It has several advantages over the traditional WordPress editor. One of the significant benefits of this editor is that it doesn’t have any issues with Google Docs.

Gutenberg editor

If you simply copy and paste content from your Google Docs document to Gutenberg, you won’t see the unnecessary span tags.

google doc pasted

Your images, headers, and paragraphs should also stay where they were. All these elements will be placed into different blocks.

Unfortunately, many site owners haven’t switched to Gutenberg yet.

For some people, it’s hard to adapt to changes.

However, the classic Visual Editor will only be supported until 2021. Therefore, you certainly will need to switch to the new editor soon. An ability to work with Google Docs easily is a great reason to do so.

Embedding Google Docs Manually

The main problem with using Google Docs in WordPress is associated with formatting. Fortunately, you can also do a little trick that requires you to copy and paste your content twice, using the clear formatting button.

  • Select and copy the critical content from your Google Docs file.
  • Paste it into WordPress Visual Editor. After this, select and copy this content once again.
  • Go to your dashboard, click “Add New,” and create a new blank post. It will be a short post that you won’t need after going through this process.
  • Paste the content from your previous post into the new temporary post. If you do this, WordPress will automatically delete all the unnecessary line breaks.
  • After this, you can select the content from your short post, copy it, and paste it into the original post.
  • Highlight the content and click the “Clear formatting” button in the toolbar of your visual editor. This way, you will quickly remove the font weights and span styles. Besides, if you do his trick, all the headers in your document will be retained. However, you will lose any bold text.

Embedding Google Docs Using the Mammoth Converter Plugin

You can also embed your Google Docs files using the Mammoth .docx Converter plugin. This plugin was created to convert .docx files to HTML, but it can also help you with Google Docs, as well.

  • Install and activate the plugin.

install and activate mammoth docs converter

  • Open your Google Docs file from Google Drive, click “File,” and select “Download as”> “Microsoft Word (.docx).” If you have already got a Word file, fine, that’ll do.

download the microsoft word file

  • Create a new draft in WordPress. Click “Posts” and scroll down until you see the “Mammoth .docx converter” section. Here you can click “Choose file” and select your .docx document.

upload docs file to mammoth docs converter

  • Ensure that the “Visual” option is on, and click “Insert into the editor.”

docs converted to post

And within a second, your post will be migrated to the WordPress editor!

docs migrated to editor

This is an excellent method because it helps deal with all the formatting issues. It keeps all the headers, images, lists, and bold text. However, it also does one weird thing, leaving an anchor text that looks like this:

<h2><a id="post-254-_45gslk456q887"></a>First Header</h2>

Fortunately, you can quickly get rid of all the anchor tags if you open your document’s textual version in a text editor. For example, you can use Sublime, which has all the necessary tools. Click “.*” for regular expressions.

After this, go to the “Find” field, and enter the following code:

(<a id="post-).*</a>

This action will help you find all the anchor tags. Now you can simply click “Replace All” and replace these tags with nothing. After this, you can just copy your text and paste it back into WordPress.

Conclusion

WordPress is so famous for a good reason: it’s a very convenient platform that allows you to customize your website however you want.

Nevertheless, it also has a drawback: if you decide to copy your content from Google Docs to the classic WordPress editor, your document’s formatting will suffer.

Fortunately, you can switch to Gutenberg Block Editor or use any of the approaches listed above. Google Docs is too convenient not to use because of the formatting issues.

You can fix your Google Docs content manually or using various plugins. This way, you will enjoy all the benefits of Google Docs without changing the platform. We hope that our tips will help you create high-quality content easily!

So these are the five simple ways to embed Google docs in WordPress.

Note: This article on 5 Easy Ways To Embed Google Docs In WordPress is contributed by Gregory V. Chapman. If you have an exciting guide/ topic to cover, feel free to check out our guest blogging guidelines!

We hope you found this article helpful and enjoyed the read. If you did, please consider sharing this article with your friends and fellow bloggers on social media. For more WordPress tutorials and product reviews, you might want to check out our blog section.


5 Easy Ways To Embed Google Docs in WordPress (Beginner’s Guide)

Did you find the article useful?

Then pin me to your Pinterest Board, so that more people will find me

(Remember: The more you give to the Universe, the more you will get from the Universe)



Back to Featured Articles on Logo Paperblog