Hexo Blogging Cheatsheet

Hexo Blogging Cheatsheet

  1. Useful links
  2. My blogโ€™s information
  3. Design
  4. Frequently used Emoji
  5. CSS
  6. Markdown (with plugins)
  7. Github Card
  8. Mermaid JS
  9. Barchart

This page also used for testing components used in the posts and pages.

My blogโ€™s information

Design

Frequently used Emoji

๐Ÿ˜„ :D(shortcut)
๐Ÿ˜„ :smile: ๐Ÿ˜Š :blush: ๐Ÿ˜ :heart_eyes:
๐Ÿ˜“ :sweat: ๐Ÿ‘ :thumbsup: ๐Ÿ˜‹ :yum:
๐Ÿ˜ฐ :cold_sweat: ๐Ÿ˜ฑ :scream: ๐Ÿ˜ญ :sob:
๐Ÿ˜œ :stuck_out_tongue_winking_eye: ๐Ÿ˜— :kissing: ๐Ÿ˜ช :sleepy:
๐Ÿ’ฉ :poop: โœŒ๏ธ :v: ๐Ÿ’ฏ :100:
๐Ÿ™ˆ :see_no_evil: ๐Ÿ™‰ :hear_no_evil: ๐Ÿ™Š :speak_no_evil:
๐Ÿ’‹ :kiss: ๐Ÿ’€ :skull: ๐Ÿ’ง :droplet:
๐ŸŽ† :fireworks: ๐Ÿ“ข :loudspeaker: โš ๏ธ :warning:
๐Ÿšซ :no_entry_sign: โœ… :white_check_mark: โŒ :x:
ใŠ™๏ธ :secret: โ‰๏ธ :interrobang: โ€ผ๏ธ :bangbang:

and more from Emoji Cheatsheet

CSS

Keys

  • Control <kbd>Contro</kbd>
  • Shift โ‡ง <kbd>Shift &#x21E7;</kbd> - use Unicode characters

Markdown (with plugins)

  • ++Inserted++ Inserted
  • Footnote [^1] for the mark[1], [^1]: for the note
  • Use {% raw %}{% endraw %} if the markdown cause you trouble on {{}} or {%%}
  • Youtube Video {% youtube [youtube id] %}
Action Markdown Sample
sub H~2~0 H20
sup x^2^ x2
Bold **bold** bold
Italic *italic* italic
Bold and Italic ***bold and italic*** bold and italic
Marked ==marked== marked
Strikethrough ~~strikethrough~~ strikethrough
Inline code `inline code` inline code
Link [link text](https://neo01.com) link text
Image ![alt text](https://neo01.com/image.jpg)

Attributes with style class, eg:

# header {.style-me}
paragraph {data-toggle=modal}
paragraph *style me*{.red} more text

output

<h1 class="style-me">header</h1>
<p data-toggle="modal">paragraph</p>
<p>paragraph <em class="red">style me</em> more text</p>

Table Column Alignment

Code:

| Default | Left | Center | Right |
| --- | :-- | :-: | --: |
| 1 | 1 | 1 | 1 |
| 22 | 22 | 22 | 22 |
| 333 | 333 | 333 | 333 |

Result:

Default Left Center Right
1 1 1 1
22 22 22 22
333 333 333 333

Blockquote

Code:

> Some quote text

Result:

Some quote text

Ordered list

Code:

1. item 1
2. item 2

Result:

  1. item 1
  2. item 2

Unordered list

Code:

- item 1
- item 2

Result:

  • item 1
  • item 2

Horizontal rule

Code:
---

Result:


Code block

Result:

Code block 

Code:

~~~
Code block 
~~~

Github Card

User

Code:

{% githubCard user:neoalienson %}

neo.alienson

@neoalienson

๐Ÿ“ Hong Kong

๐Ÿ”— https://01man.com

๐Ÿ“ 44
Repositories
โญ 22
Stars
๐Ÿ“ˆ 33
Commits
๐Ÿ‘ฅ 13
Followers
๐Ÿ”„ 20
Pull Requests
โ— 0
Issues
JavaScript 52.6% Swift 10.5% TypeScript 7.9% Dart 5.3% C++ 5.3% Other 18.4%

A repository

Code:

{% githubCard user:neoalienson repo:pachinko %}

Result:

๐Ÿ“–

neoalienson/pachinko

An iOS 'pinball' game using SpriteKit and Swift with physics engine

โญ 7 Stars ๐Ÿด 1 Forks Language: C++

Mermaid JS

Prerendered.

Code:

{% mermaid %}
block-beta
columns 1
  db(("DB"))
  blockArrowId6<["   "]>(down)
  block:ID
    A
    B["A wide one in the middle"]
    C
  end
  space
  D
  ID --> D
  C --> D
  style B fill:#969,stroke:#333,stroke-width:4px
{% endmermaid %}

Result:

block-beta columns 1 db(("DB")) blockArrowId6<["   "]>(down) block:ID A B["A wide one in the middle"] C end space D ID --> D C --> D style B fill:#969,stroke:#333,stroke-width:4px

Live rendering

block-beta
columns 1
  db(("DB"))
  blockArrowId6<["   "]>(down)
  block:ID
    A
    B["A wide one in the middle"]
    C
  end
  space
  D
  ID --> D
  C --> D
  style B fill:#969,stroke:#333,stroke-width:4px

Barchart

Result:

Code:

{% echarts %}
{
  "title": {
    "text": "Ephemeral Port Ranges by Operating System"
  },
  "tooltip": {},
  "xAxis": {
    "type": "category",
    "data": ["Linux (Old)", "Linux (New)", "Windows", "FreeBSD", "macOS"]
  },
  "yAxis": {
    "type": "value",
    "name": "Number of Ports"
  },
  "series": [{
    "type": "bar",
    "data": [28233, 28232, 16384, 55536, 16384],
    "itemStyle": {
      "color": "#1976d2"
    }
  }]
}
{% endecharts %}

  1. Footnote sample โ†ฉ๏ธŽ

Share