View on GitHub

code-blocks

Syntax highlighting for Google Docs

img

clasp Donate

Usage

Installation

Code Blocks is available on the G Suite Marketplace. Select Install to begin using it in Google Docs.

Starting the add-on

starting

Formatting inline code

inline-formatting

Formatting code blocks

blocks-formatting

Reformatting code blocks

reformatting-blocks

Previewing themes

Examples of the different color themes applied to various languages can be found on the highlight.js demo page.

Unformatting code

To clear formatting in Docs, highlight the text and select Format > Clear Formatting from the toolbar. The keyboard shortcut is Cmd+/ on OS X and Ctrl+/ on Windows: https://support.google.com/docs/answer/179738

This will not remove the table that the text lives in if it’s a “code block”. To do that, you’ll have to copy the text and paste it outside the table, then right-click the table and select Delete table.

Limitations

New language support

Code Blocks is built with highlight.js and can only provide syntax highlighting for languages that are supported by that library. If you’d like to see Code Blocks support a language that is not yet implemented by highlight.js, please refer to their page on requesting new languages, found here.

Real-time syntax highlighting

Codes Blocks uses Google’s Apps Script, a server-side JavaScript platform, to interact with Docs and format code. Each time the add-on formats a snippet of code, a request is made to the Apps Script backend to modify the current Doc. There are a few limitations of this platform that prevent Code Blocks from formatting code as you type:

Keyboard Shortcuts

Keyboard shortcuts can only be handled by Code Blocks if the add-on sidebar is focused, which would require users to click the sidebar anyway.

Keyboard events in the active document cannot currently be handled by Docs add-ons: https://issuetracker.google.com/issues/79461369

Contributing

Setup

$ npm install

Building

$ npm run build

Pushing Changes

NOTE: The following commands only work for the project maintainer because they require Google Drive authorization.

Command Description
npm run push:gas just GAS files
npm run push:js just sidebar.js
npm run push:static just HTML & CSS
npm run push everything

Google Apps Script Resources


Homepage G Suite Marketplace Privacy Policy Terms of Service