How-To

How to Insert a Code Block in Google Docs

By Adam Davidson

Updated November 30, 2023

Word processor autoformatting and programming code are never a good mix. Learn how to insert a code block in Google Docs.

Certain questions divide the world. Tom or Jerry? Pepsi or Coke? Two-space indents or four-space indents?

Okay, maybe that last one isn’t quite as universal as the first two, but it’s still something that divides people who write code (which could be you if you don’t already know how). You’ve probably heard code described as “elegant” or “crappy” and the difference can come down to the formatting. To make matters worse, word processors tend to mess with your formatting when you’re trying to add code to a document.

That’s where code blocks can help. These are blocks within your document that are specifically for code, allowing you to display your code as it was intended. They can even automatically apply the correct formatting and highlighting to your code. Here’s how to insert a code block in Google Docs.

How to Insert a Code Block in Google Workspace

If you’re running some editions of Google Workspace, you can insert a code block directly within Google Docs. This feature is only available in the Business Standard, Business Plus, Education Standard, Education Plus, Enterprise Standard, and Enterprise Plus editions of Google Workspace. If you’re running a different edition, you won’t be able to use this feature.

1. Open the Google Doc where you want to insert your code.
2. Click the Insert menu.
   
3. Hover over Building Blocks.
   
4. If you’re running a supported edition of Google Workspace, you’ll see the Code Block option.
5. Select Code Block and choose C/C++, Java, JavaScript, Python, or Unset.
6. Enter your code directly into the block. The code will be formatted and highlighted according to the language that you selected.

How to Insert a Code Block in Google Docs Using an Extension

If you’re not using one of the supported versions of Google Workspace, it’s still possible to insert a code block in Google Docs. However, to do so you’ll need to install a third-party add-on. There are multiple options available; in this example, I’ll be using the free extension Code Blocks.

1. Open the document where you want to insert your code.
2. Click the Extensions menu.
   
3. Hover over Add-ons and select Get Add-ons.
   
4. Type Code Blocks in the search field.
   
5. Select Code Blocks from the results.
   
6. Click Install and grant the relevant permissions.
   
7. Once the add-on installs, click the Extensions menu.
   
8. Hover over Code Blocks and click Start.
   
9. The Code Blocks tool will appear in the sidebar.
10. Enter your code into your document and select it all.
11. In the sidebar, choose a Language, or leave it as Auto.
    
12. Select a Theme for your code block.
    
13. You can preview your selections by clicking the Preview button.
    
14. When you’re happy with your choices, click the Format button.
    
15. The code in your document will be formatted into a code block.
    
16. You can add multiple code blocks and use different languages and themes for each.
17. You can add more text to each code block, but to apply the correct formatting, you’ll need to select it all and click the Format button again.
18. Any text you add outside of the code block will keep the current text settings for standard text.

Why Should You Insert a Code Block in Google Docs?

With code, formatting is everything. It’s not just a question of aesthetics, either. Properly formatted code is easier to read, making it simpler to spot errors if you have any. When your code is a mess, it’s much harder to track down a missing comma or bracket that’s stopping your code from working.

Highlighting can also help. Using the methods above, highlighting is automatically applied to your code, making it much simpler to spot errors by applying different colors to different parts of your code. It also makes your code look much nicer in your documents, too.

If you try to write code in Google Docs without using a code block, the chances are that the formatting is going to get messed up. Even if you spend ages fixing the indentation, you may still find that adding one more line causes Google Docs to autoformat your text and put everything back out of whack again. It means that if someone wants to copy the code for your document, the horrible formatting will come with it, and the code may not even run.

By using a code block, you can ensure that your code is correctly formatted for your chosen programming language and can be easily copied and pasted elsewhere without any issues.

Doing More With Google Docs

Learning how to insert a code block in Google Docs allows you to do more with your documents than just word processing. There’s so much more that you can add to your documents than just plain walls of text. You can add images, insert videos, create tables, produce charts, or even insert your QR codes. Take a deeper look at Google Docs and you’ll be impressed at the array of things you can do.