Generate Google Slides from markdown

Installation and usage

Get your OAuth client ID credentials:

• Create (or reuse) a developer project at https://console.developers.google.com
• Enable Google Slides API at API library page
• Go to Credentials page and click "+ Create credentials" at the top
• Create "OAuth client ID" type of credentials.
• Choose type "Computer Application" and give it some name.
• Download client ID/secret file and shorten the name to: client_id.json.
• Move client_id.json onto your disk.

After installing, import your slides by running:

bun src/index.ts -f examples/example.md --client_id client_id.json

You'll get a slide deck named "example.md".

NOTE: The first time you run the md2gslides command, you will be prompted for authorization. OAuth token credentials are stored in ~/.md2googleslides/credentials.json. You may get a "scary-looking" screen that says, "Google hasn't verified this app." Click "Advanced" then "Go to APP-NAME (unsafe)" if you trust yourself as the author of the app that's requesting to access your Slides files in Drive.

Supported markdown rules

md2gslides uses a subset of the CommonMark and Github Flavored Markdown rules for markdown.

Slides

Each slide is typically represented by a header, followed by zero or more block elements.

Begin a new slide with a horizontal rule (---). The separator may be omitted for the first slide.

The following examples show how to create slides of various layouts:

Title slide

    ---

    # This is a title slide
    ## Your name here

Section title slides

    ---

    # This is a section title

Section title & body slides

    ---

    # Section title & body slide

    ## This is a subtitle

    This is the body

Title & body slides

    ---

    # Title & body slide

    This is the slide body.

Main point slide

Add {.big} to the title to make a slide with one big point

    ---

    # This is the main point {.big}

Big text slide

Use {.big} on a # header in combination with no body.

    ---

    # 100% {.big}

Big number slide

Use {.big} on a header in combination with a body too.

    ---

    # 100% {.big}

    This is the body

Two column slides

Separate columns with {.column}. The marker must appear on its own line with a blank both before and after.

    ---

    # Two column layout

    This is the left column

    {.column}

    This is the right column

Themes

md2googleslides does not edit or control any theme related options. Just set a base theme you want on Google Slides directly. Even if you will use --append option for deck reuse, theme will be not changed.

Images

Inline images

Images can be placed on slides using image tags. Multiple images can be included. Mulitple images in a single paragraph are arranged in columns, multiple paragraphs arranged as rows. NOTE: Images are currently scaled and centered to fit the slide template.

    ---

    # Slides can have images

    ![](https://placekitten.com/900/900)

Background images

Set the background image of a slide by adding {.background} to the end of an image URL.

    ---

    # Slides can have background images

    ![](https://placekitten.com/1600/900){.background}

Videos

Include YouTube videos with a modified image tag.

    ---

    # Slides can have videos

    @[youtube](MG8KADiRbOU)

Speaker notes

Include speaker notes for a slide using HTML comments. Text inside the comments may include markdown for formatting, though only text formatting is allowed. Videos, images, and tables are ignored inside speaker notes.

    ---

    # Slide title

    ![](https://placekitten.com/1600/900){.background}

    <!--
    These are speaker notes.
    -->

Formatting

Basic formatting rules are allowed, including:

• Bold
• Italics
• Code
• Strikethrough
• Hyperlinks
• Ordered lists
• Unordered lists

The following markdown illustrates a few common styles.

**Bold**, *italics*, and ~~strikethrough~~ may be used.

Ordered lists:
1. Item 1
1. Item 2
  1. Item 2.1

Unordered lists:
* Item 1
* Item 2
  * Item 2.1

You CAN NOT mix ordered and unordered lists when nesting lists. For example this is invalid:

* Item 1
    1. INVALID Item 1.1
* Item 2
    2. INVALID Item 2.1

Additionally, a subset of inline HTML tags are supported for styling.

• <span>
• <sup>
• <sub>
• <em>
• <i>
• <strong>
• <b>

Supported CSS styles for use with <span> elements:

• color
• background-color
• font-weight: bold
• font-style: italic
• text-decoration: underline
• text-decoration: line-through
• font-family
• font-variant: small-caps
• font-size (must use points for units)

You may also use {style="..."} attributes after markdown elements to apply styles. This can be used on headers, inline elements, code blocks, etc.

Emoji

Use Github style emoji in your text using the :emoji:.

The following example inserts emoji in the header and body of the slide.

### I :heart: cats

:heart_eyes_cat:

Code blocks

Both indented and fenced code blocks are supported, with syntax highlighting.

The following example renders highlighted code.

### Hello World

```javascript
console.log('Hello world');
```

To change the syntax highlight theme specify the --style <theme> option on the command line. All highlight.js themes are supported. For example, to use the github theme

md2gslides slides.md --style github

You can also apply additional style changes to the entire block, such as changing the font size:

### Hello World

```javascript
console.log('Hello world');
```{style="font-size: 36pt"}

Tables

Tables are supported via GFM syntax.

Note: Including tables and other block elements on the same slide may produce poor results with overlapping elements. Either avoid or manually adjust the layout after generating the slides.

The following generates a 2x5 table on the slide.

### Top pets in the United States

Animal | Number
-------|--------
Fish   | 142 million
Cats   | 88 million
Dogs   | 75 million
Birds  | 16 million

Reading from standard input

You can also pipe markdown into the tool by omitting the file name argument.

License

This library is licensed under Apache 2.0. Full license text is available in LICENSE.