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
Step 3: Enter in the Gist description, filename with the extension and the code as per below.
Choose to create private/public gist
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.