Google Docs

How to Format Code in Google Docs

Spencer LanoueSpencer Lanoue
Google Docs

Formatting code in Google Docs can feel like trying to fit a square peg into a round hole. While Google Docs is a fantastic tool for writing and collaboration, it doesn't come with built-in features for code formatting. But don't worry! There are some handy tricks and workarounds that can make your code snippets look neat and professional in no time. We'll explore some straightforward methods to help you format code effectively within Google Docs.

🔮
The AI Alternative to Google Docs & Word:
Save time by letting Spell write your docs for you. Turn hours of doc writing work into minutes. Try it free →

Using Inline Code with a Simple Font Change

Sometimes, all you need is a quick fix to make your code stand out from the rest of your document. One easy way to achieve this is by changing the font of your code snippets to a monospace font. Monospace fonts, like Courier New or Consolas, give your text a more "code-like" appearance, as each character takes up the same amount of space. Here's how you can do it:

  • Highlight the code you want to format.
  • Go to the toolbar and click on the font menu.
  • Select a monospace font like Courier New or Consolas.

While this method is simple, it might not be enough for larger blocks of code or when you want to include syntax highlighting. But it's a great start for smaller snippets or inline code.

Leveraging Code Blocks with Google Docs Add-ons

When the simple font change doesn't cut it, you can turn to Google Docs add-ons. One popular add-on is "Code Blocks," which allows you to format code with syntax highlighting directly in your document. Here's how you can use it:

  • Open your Google Docs document.
  • Click on "Extensions" in the menu bar, then select "Add-ons" and "Get add-ons."
  • Search for "Code Blocks" and install the add-on.
  • After installation, select the code you want to format, click on "Extensions" again, then "Code Blocks" and "Format code."
  • Choose your preferred language and theme, then insert the formatted code into your document.

This method is particularly useful if you frequently work with code snippets in various languages. The add-on provides a range of themes and languages to choose from, making your code not only readable but visually appealing too.

The AI-First Document Editor
Spell is the AI-powered alternative to Google Docs and Microsoft Word.
Get started for free

Copying Code from an IDE or Text Editor

If you're already using an Integrated Development Environment (IDE) or a text editor with syntax highlighting, you can take advantage of this by copying and pasting the formatted code into Google Docs. Here's a simple way to do it:

  • Select the code in your IDE or text editor.
  • Copy it (Ctrl+C or Cmd+C on Mac).
  • Open your Google Docs document and paste it (Ctrl+V or Cmd+V on Mac).

While this method can sometimes carry over the formatting, Google Docs may not always retain all the syntax highlighting. If this happens, consider combining this method with the Code Blocks add-on for better results.

Creating a Custom Style for Code

If you often include code in your Google Docs, creating a custom style can save you a lot of time. This way, you won't have to manually format each snippet. Here's how you can set up a custom style:

  • Select some text in your document and apply the desired font and size (like Courier New and 10pt).
  • With the text still selected, click on the "Styles" drop-down menu in the toolbar.
  • Select "Normal text" and then "Update 'Normal text' to match."
  • Now, whenever you paste or type in code, just apply the "Normal text" style to format it automatically.

This method is great for consistency and efficiency, especially if you're dealing with multiple code snippets throughout your document.

Using Tables for Better Code Structure

For larger blocks of code, tables can help organize your content and prevent text wrapping issues. Here's a quick way to leverage tables for code formatting:

  • Insert a single-cell table into your document (Insert > Table > 1x1).
  • Paste your code into the table cell.
  • Adjust the table properties to remove borders if needed.
  • Apply a monospace font to the text within the table cell.

This approach keeps your code neatly contained and easy to read, making it especially useful for longer code snippets.

Go From Idea to Polished Doc 10x Faster With Spell 🪄
Get started for free

Exploring Third-Party Tools

Sometimes, the built-in options and add-ons in Google Docs might not meet all your needs. In such cases, third-party tools can offer more advanced features. For example, Spell is an AI-powered document editor that seamlessly integrates writing and editing capabilities, making document creation a breeze. With Spell, you can generate drafts, refine content, and even collaborate in real-time, all with AI assistance.

By using Spell, you can draft and format your code snippets in a way that maintains readability and professionalism without constantly switching between tools. It's like having a Google Docs experience, but with AI built directly into the editor.

Making Use of Google Docs' "Comment" Feature

If you need to include code as a reference or for documentation purposes, using Google Docs' comment feature can keep your main document clean while still providing the necessary information. Here's how you can do it:

  • Select the text or line you want to comment on.
  • Click on the "Add comment" button in the toolbar or right-click and select "Comment."
  • Type or paste your code into the comment box.

This method is particularly useful for collaborative work, where you might want to suggest changes or explain code to team members without cluttering the main content.

The AI Alternative to Google Docs
Go from idea to polished doc in seconds with Spell's AI-powered document editor.
Create my first doc

Utilizing Google Docs' "Equation" Tool

While not the most conventional method, Google Docs' "Equation" tool can be repurposed for formatting simple code snippets, especially for math-related coding. Here's how you can use it:

  • Go to "Insert" in the menu bar and select "Equation."
  • In the equation editor, type your code.

While it doesn't provide syntax highlighting, the equation editor offers a unique way to format and present code, particularly for mathematical or algorithmic content.

This unconventional method can be a fun way to experiment with code formatting in Google Docs, especially if you're dealing with equations or algorithms.

Final Thoughts

Formatting code in Google Docs might seem tricky at first, but with the right techniques, you can make it work. From simple font changes to using add-ons and third-party tools like Spell, these methods can help you create documents that are both functional and visually appealing. Spell, with its AI-powered capabilities, can make document creation faster and easier, offering a seamless way to handle code formatting and more.

Spencer Lanoue

Spencer Lanoue

Spencer has been working in product and growth for the last 10 years. He's currently Head of Growth at Sugardoh. Before that he worked at Bump Boxes, Buffer, UserTesting, and a few other early-stage startups.