2015-12-30-markdown-cheatsheet-demo.md (3058B)
1 --- 2 layout: post 3 title: "Markdown Cheatsheet Demo" 4 comments: true 5 description: "Markdown Cheatsheet Demo..." 6 keywords: "markdown, typography components, dummy content" 7 --- 8 9 ## Typography Elements in One 10 11 Let's start with a informative paragraph. **This text is bolded.** But not this one! _How about italic text?_ Cool right? Ok, let's **_combine_** them together. Yeah, that's right! I have code to highlight, so `ThisIsMyCode()`. What a nice! Good people will hyperlink away, so [here we go](#) or [http://www.example.com](http://www.example.com). 12 13 <div class="divider"></div> 14 15 ## Headings H1 to H6 16 17 # H1 Heading 18 19 ## H2 Heading 20 21 ### H3 Heading 22 23 #### H4 Heading 24 25 ##### H5 Heading 26 27 ###### H6 Heading 28 29 <div class="divider"></div> 30 31 ## Footnote 32 33 Let's say you have text that you want to refer with a footnote, you can do that too! This is an example for the footnote number one [[^1]]. You can even add more footnotes, with link! [[^2]] 34 35 <div class="divider"></div> 36 37 ## Blockquote 38 39 > Start by doing what's necessary; then do what's possible; and suddenly you are doing the impossible. --Francis of Assisi 40 41 **NOTE:** This theme does NOT support nested blockquotes. 42 43 <div class="divider"></div> 44 45 ## List Items 46 47 1. First order list item 48 2. Second item 49 50 * Unordered list can use asterisks 51 - Or minuses 52 + Or pluses 53 54 <div class="divider"></div> 55 56 ## Code Blocks 57 58 ```javascript 59 var modularpattern = (function() { 60 // your module code goes here 61 var sum = 0 ; 62 63 return { 64 add:function() { 65 sum = sum + 1; 66 return sum; 67 }, 68 reset:function() { 69 return sum = 0; 70 } 71 } 72 }()); 73 alert(modularpattern.add()); // alerts: 1 74 alert(modularpattern.add()); // alerts: 2 75 alert(modularpattern.reset()); // alerts: 0 76 ``` 77 78 ```python 79 s = "Python syntax highlighting" 80 print s 81 ``` 82 83 ``` 84 No language indicated, so no syntax highlighting. 85 But let's throw in a <b>tag</b>. 86 ``` 87 88 <div class="divider"></div> 89 90 ## Table 91 92 ### Table 1: With Alignment 93 94 | Tables | Are | Cool | 95 | ------------- |:-------------:| -----:| 96 | col 3 is | right-aligned | $1600 | 97 | col 2 is | centered | $12 | 98 | zebra stripes | are neat | $1 | 99 100 ### Table 2: With Typography Elements 101 102 Markdown | Less | Pretty 103 --- | --- | --- 104 *Still* | `renders` | **nicely** 105 1 | 2 | 3 106 107 <div class="divider"></div> 108 109 ## Horizontal Line 110 111 The HTML `<hr>` element is for creating a "thematic break" between paragraph-level elements. In markdown, you can create a `<hr>` with any of the following: 112 113 * `___`: three consecutive underscores 114 * `---`: three consecutive dashes 115 * `***`: three consecutive asterisks 116 117 renders to: 118 119 ___ 120 121 --- 122 123 *** 124 125 <div class="divider"></div> 126 127 ## Media 128 129 ### YouTube Embedded Iframe 130 131 <div class="video-container"><iframe src="https://www.youtube.com/embed/n1a7o44WxNo" frameborder="0" allowfullscreen></iframe></div> 132 133 ### Image 134 135  136 137 --- 138 Footnote: 139 140 [^1]: 1: Footnote number one yeah baby! 141 142 [^2]: 2: A footnote you can link to - [click here!](#)