Coders — How to add source code to your Medium articles

Sherlynn Tan
Jan 1 · 2 min read

So as I was writing an article pertaining to coding work, I knew that I could add Code blocks & Inline code as a feature provided by Medium.

Code block

To begin a code block, on a new line type in ``` (triple backtick).
Keyboard shortcut: ⌘ + Opt + 6 / Ctrl + Alt + 6.

This is 
an example of a
code block

Inline code

For inline code in a paragraph, type a single backtick ` to begin and end your code. Or highlight some text and press the backtick key.

An example of an inline code

Note: Code blocks and inline code are not supported on mobile.

Adding Source code

At times, I would prefer to display the source code especially when the code is lengthy. This provides for better readability and added color.

We can use Github Gists, Codepen.io, or JSfiddle. Paste your snippet URL from one of those sources to a new line in the editor and press Enter. The Source code will be embedded automatically.

A walkthrough for using Github Gists:

Example code:

<html>
<head>
<title>How to add source code to Medium</title>
</head>
<body>

</body>
</html>

Step 1: Log in to your GitHub account. https://github.com/

Step 2: On the right of the navigation menu, click on the + and select New gist

Select “New gist”

Step 3: Enter in the Gist description, filename with the extension and the code as per below.

Enter Gist description, filename and add code

Choose to create private/public gist

Gist created with Syntax highlighting

Step 4: Click Share to get a shareable link for the gist

Step 6: Paste the GitHub gist link in your article. Hit enter. The gist will turn into source code automatically:

Ta-da!
Hope this helps someone.

Sherlynn Tan

Written by

Software Developer at Thoughtworks | Marathon Runner | Ex-Pharmacist Writing on Coding, Technology and Running

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade