How to insert code block in Google Docs

Whether a code is considered good or bad depends on its format. Word processors tend to mess up your formatting when you're trying to add code to a document.

Whether a code is considered good or bad depends on its format. Word processors tend to mess up your formatting when you're trying to add code to a document.

That's where code blocks can help. These are blocks in the document dedicated to code, allowing you to display your code as intended. They can even automatically apply correct formatting and highlighting to your code. Below is how to insert code blocks in Google Docs.

How to insert code blocks in Google Workspace

If you're running certain versions of Google Workspace, you can insert code blocks right in 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 version, 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 .

Picture 1 of How to insert code block in Google Docs

3. Hover over the Building Blocks section .

Picture 2 of How to insert code block in Google Docs

 

4. If you're running a supported version of Google Workspace, you'll see the Code Block option .

5. Select Code Block and select 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 you selected.

How to insert code blocks in Google Docs using extensions

If you're not using one of the supported versions of Google Workspace, you can still insert code blocks into Google Docs. However, to do so, you will need to install a third-party add-on. There are many options available; This example will use the free Code Blocks extension.

1. Open the document where you want to insert your code.

2. Click the Extensions menu .

Picture 3 of How to insert code block in Google Docs

3. Hover over Add-ons and select Get Add-ons .

Picture 4 of How to insert code block in Google Docs

4. Enter Code Blocks in the search field.

Picture 5 of How to insert code block in Google Docs

5. Select Code Blocks from the results.

Picture 6 of How to insert code block in Google Docs

 

6. Click Install and grant relevant permissions.

Picture 7 of How to insert code block in Google Docs

7. After installing the add-on, click the Extensions menu .

Picture 8 of How to insert code block in Google Docs

8. Hover over Code Blocks and click Start .

Picture 9 of How to insert code block in Google Docs

9. The Code Blocks tool will appear in the sidebar.

10. Enter your code into the document and select all.

11. In the sidebar, select Language or leave it on Auto .

Picture 10 of How to insert code block in Google Docs

12. Choose a Theme for your code block.

Picture 11 of How to insert code block in Google Docs

13. You can preview your selections by clicking the Preview button .

Picture 12 of How to insert code block in Google Docs

 

14. When you are satisfied with your selection, click the Format button .

Picture 13 of How to insert code block in Google Docs

15. The code in your document will be formatted into a code block.

Picture 14 of How to insert code block in Google Docs

16. You can add multiple code blocks and use different languages ​​and themes for each block.

17. You can add more text to each code block, but to apply the correct formatting, you will need to select them all and click the Format button again .

18. Any text you add outside of the code block will retain the current text settings for standard text.

Update 05 December 2023
Category

System

Mac OS X

Hardware

Game

Tech info

Technology

Science

Life

Application

Electric

Program

Mobile