Getting Started

Use redcarpet as markdown processor in _config.xml.

markdown: redcarpet
highlighter: pygments
redcarpet:
  extensions: ["no_intra_emphasis", "tables", "autolink", "strikethrough", "fenced_code_blocks", "with_toc_data"]

Add markdown-body id and class for posts content.

<article id="markdown-body" class="post-content markdown-body">
  {\{ content \}}
</article>

Add github-markdown.css to html header or save it as _github-markdown.scss and import it in your main.css.

@import
        "base",
        "layout",
        "github-markdown",
        "syntax-highlighting"
;

Modify the _syntax-highlighting.sass to adjust code colors as github.

Hover anchor and Task list

Add gfm-hack.js to html <head> to enable <h2> ~ <h6> hover anchor and - [ ] or - [x] task list in github.

<head>
...
<script type="text/javascript" src="/js/gfm-hack.js"/>
</head>

Emoji

Add the install script in Gemfile, if not exists the file then create one.

gem 'jemojy'

Add the dependency in _config.yml.

gems: [jemoji]

Tests

Table

| First Header  | Second Header |
| ------------- | ------------- |
| Content Cell  | Content Cell  |
| Content Cell  | Content Cell  |
First Header Second Header
Content Cell Content Cell
Content Cell Content Cell

Task List

- [ ] a task list item
- [ ] list syntax required
- [ ] normal **formatting**, @mentions, #1234 refs
- [ ] incomplete
- [x] completed
  • [ ] a task list item
  • [ ] list syntax required
  • [ ] normal formatting, @mentions, #1234 refs
  • [ ] incomplete
  • [x] completed

Highlighting

```java
/**
 * Greet jekyll for the github flavored markdown
 */
class GreetGFM {
    private static final String GREET = "Hello Jekyll! Hello Github Flavored Markdown!";
    public static void main(String[] args) {
        System.out.println(GREET);
    }
}
```

/**
 * Greet jekyll for the github flavored markdown
 */
class GreetGFM {
    private static final String GREET = "Hello Jekyll! Hello Github Flavored Markdown!";
    public static void main(String[] args) {
        System.out.println(GREET);
    }
}

Emoji

I give this ariticle 32 ：+1：! (the colon here should be half-width)

I give this ariticle 32 :+1:!

Reference

Source

All the sources are on here.

Comments