simplemde-markdown-editor/index.html

<!DOCTYPE html>
<html lang="en-us">
  <head>
	<meta charset="UTF-8">
	<title>JavaScript Markdown Editor - SimpleMDE</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" type="text/css" href="stylesheets/normalize.css" media="screen">
	<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
	<link rel="stylesheet" type="text/css" href="stylesheets/stylesheet.css" media="screen">
	<link rel="stylesheet" type="text/css" href="stylesheets/github-light.css" media="screen">
	<link rel="canonical" href="https://simplemde.com/" />
	
	<script>
	if(window.location.href.indexOf("sparksuite.github.io") !== -1) {
		window.location.href = "https://simplemde.com/";
	}
	
	if(window.location.protocol != "https:")
		window.location.href = "https:"+window.location.href.substring(window.location.protocol.length);
	</script>
	
	<style>
	.editor-preview h1,
	.editor-preview h2,
	.editor-preview h3,
	.editor-preview h4,
	.editor-preview h5{
		margin-bottom:10px;
	}
	
	.editor-preview h1{
		border-bottom:1px solid #ddd;
	}
	
	.editor-preview h1{
		border-bottom:1px solid #eee;
	}
	</style>
  </head>
  <body>
	<section class="page-header">
	  <h1 class="project-name">SimpleMDE Markdown Editor</h1>
	  <h2 class="project-tagline">SimpleMDE is a simple, embeddable, and beautiful JS markdown editor</h2>
	  <a href="https://github.com/sparksuite/simplemde-markdown-editor" class="btn">View on GitHub</a>
	  <a href="https://github.com/sparksuite/simplemde-markdown-editor/zipball/master" class="btn">Download .zip</a>
	  <a href="https://github.com/sparksuite/simplemde-markdown-editor/tarball/master" class="btn">Download .tar.gz</a>
	</section>

	<section class="main-content">
	  <h1><a id="h1_demo1" class="anchor" href="#h1_demo1" aria-hidden="true"><span class="octicon octicon-link"></span></a>Demo</h1>

<textarea id="demo1"># Intro
Go ahead, play around with the editor! Be sure to check out **bold** and *italic* styling, or even [links](https://google.com). You can type the Markdown syntax, use the toolbar, or use shortcuts like `cmd-b` or `ctrl-b`.

## Lists
Unordered lists can be started using the toolbar or by typing `* `, `- `, or `+ `. Ordered lists can be started by typing `1. `.

#### Unordered
* Lists are a piece of cake
* They even auto continue as you type
* A double enter will end them
* Tabs and shift-tabs work too

#### Ordered
1. Numbered lists...
2. ...work too!

## What about images?
![Yes](https://i.imgur.com/sZlktY7.png)</textarea>

<h1><a id="h1_demo2" class="anchor" href="#h1_demo2" aria-hidden="true"><span class="octicon octicon-link"></span></a>Autosaving</h1>

<textarea id="demo2"># This one autosaves!
By default, it saves every 10 seconds, but this can be changed. When this textarea is included in a form, it will automatically forget the saved value when the form is submitted.</textarea>

<h1><a id="h1_demo3" class="anchor" href="#h1_demo3" aria-hidden="true"><span class="octicon octicon-link"></span></a>Hidden toolbar and status bar</h1>

<textarea id="demo3"># This one is bare
You can also choose to hide the statusbar and/or toolbar for a simple and clean appearance. This one also checks for misspelled words as you type!</textarea>

	  <footer class="site-footer">
		<span class="site-footer-credits"><a href="https://github.com/sparksuite/simplemde-markdown-editor">SimpleMDE Markdown Editor</a> is created and maintained by <a href="https://github.com/sparksuite">Sparksuite</a></span>
	  </footer>

	</section>

	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css">
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.css">
	<script src="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.js"></script>
	
	<script>
	new SimpleMDE({
		element: document.getElementById("demo1"),
		spellChecker: false,
	});
	
	new SimpleMDE({
		element: document.getElementById("demo2"),
		spellChecker: false,
		autosave: {
			enabled: true,
			unique_id: "demo2",
		},
	});
	
	new SimpleMDE({
		element: document.getElementById("demo3"),
		status: false,
		toolbar: false,
	});
	</script>
	
	<script>
	  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
	  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
	  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
	  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
	
	  ga('create', 'UA-5808021-18', 'auto');
	  ga('send', 'pageview');
	
	</script>
  </body>
</html>
Create gh-pages branch via GitHub 2015-06-19 22:18:14 +02:00			`<!DOCTYPE html>`
			`<html lang="en-us">`
			`<head>`
Add textarea 2015-06-22 22:24:08 +02:00			`<meta charset="UTF-8">`
Update SEO title 2016-02-25 23:55:14 +01:00			`<title>JavaScript Markdown Editor - SimpleMDE</title>`
Add textarea 2015-06-22 22:24:08 +02:00			`<meta name="viewport" content="width=device-width, initial-scale=1">`
			`<link rel="stylesheet" type="text/css" href="stylesheets/normalize.css" media="screen">`
Change to https always 2015-07-21 17:04:32 +02:00			`<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>`
Add textarea 2015-06-22 22:24:08 +02:00			`<link rel="stylesheet" type="text/css" href="stylesheets/stylesheet.css" media="screen">`
			`<link rel="stylesheet" type="text/css" href="stylesheets/github-light.css" media="screen">`
Use HTTPS 2016-01-27 18:23:39 +01:00			`<link rel="canonical" href="https://simplemde.com/" />`
Redirect users to new domain, add canonical tag 2016-01-27 18:16:42 +01:00
			`<script>`
Update company name 2017-05-16 21:07:58 +02:00			`if(window.location.href.indexOf("sparksuite.github.io") !== -1) {`
Use HTTPS 2016-01-27 18:23:39 +01:00			`window.location.href = "https://simplemde.com/";`
Redirect users to new domain, add canonical tag 2016-01-27 18:16:42 +01:00			`}`
Force SSL 2016-01-27 18:24:37 +01:00
			`if(window.location.protocol != "https:")`
			`window.location.href = "https:"+window.location.href.substring(window.location.protocol.length);`
Redirect users to new domain, add canonical tag 2016-01-27 18:16:42 +01:00			`</script>`
Update default text and styling 2015-06-22 23:14:03 +02:00
			`<style>`
			`.editor-preview h1,`
			`.editor-preview h2,`
			`.editor-preview h3,`
			`.editor-preview h4,`
Fix CSS bug 2015-06-22 23:15:05 +02:00			`.editor-preview h5{`
Update default text and styling 2015-06-22 23:14:03 +02:00			`margin-bottom:10px;`
			`}`

Fix CSS bug 2015-06-22 23:15:05 +02:00			`.editor-preview h1{`
Update default text and styling 2015-06-22 23:14:03 +02:00			`border-bottom:1px solid #ddd;`
			`}`
Update text and styling again 2015-06-22 23:17:05 +02:00
			`.editor-preview h1{`
			`border-bottom:1px solid #eee;`
			`}`
Update default text and styling 2015-06-22 23:14:03 +02:00			`</style>`
Create gh-pages branch via GitHub 2015-06-19 22:18:14 +02:00			`</head>`
			`<body>`
Add textarea 2015-06-22 22:24:08 +02:00			`<section class="page-header">`
			`<h1 class="project-name">SimpleMDE Markdown Editor</h1>`
Update tagline for SEO 2016-02-25 23:56:05 +01:00			`<h2 class="project-tagline">SimpleMDE is a simple, embeddable, and beautiful JS markdown editor</h2>`
Update company name 2017-05-16 21:07:58 +02:00			`<a href="https://github.com/sparksuite/simplemde-markdown-editor" class="btn">View on GitHub</a>`
			`<a href="https://github.com/sparksuite/simplemde-markdown-editor/zipball/master" class="btn">Download .zip</a>`
			`<a href="https://github.com/sparksuite/simplemde-markdown-editor/tarball/master" class="btn">Download .tar.gz</a>`
Add textarea 2015-06-22 22:24:08 +02:00			`</section>`
Create gh-pages branch via GitHub 2015-06-19 22:18:14 +02:00
Add textarea 2015-06-22 22:24:08 +02:00			`<section class="main-content">`
Add H1s for clarity 2015-06-27 21:45:33 +02:00			`<h1><a id="h1_demo1" class="anchor" href="#h1_demo1" aria-hidden="true"><span class="octicon octicon-link"></span></a>Demo</h1>`
Create gh-pages branch via GitHub 2015-06-19 22:18:14 +02:00
Show different options on the demo 2015-06-27 21:40:19 +02:00			`<textarea id="demo1"># Intro`
Use HTTPS for Imgur to avoid mixed content While we're at it, change the link to Google to HTTPS too. 2016-11-01 06:57:34 +01:00			Go ahead, play around with the editor! Be sure to check out bold and italic styling, or even [links](https://google.com). You can type the Markdown syntax, use the toolbar, or use shortcuts like `cmd-b` or `ctrl-b`.
Add default text 2015-06-22 22:41:34 +02:00
			`## Lists`
Update default text and styling 2015-06-22 23:14:03 +02:00			Unordered lists can be started using the toolbar or by typing `* `, `- `, or `+ `. Ordered lists can be started by typing `1. `.

Decrease header size 2015-06-22 23:17:55 +02:00			`#### Unordered`
Fix demo text 2015-06-27 21:47:13 +02:00			`* Lists are a piece of cake`
Add default text 2015-06-22 22:41:34 +02:00			`* They even auto continue as you type`
Update default text and styling 2015-06-22 23:14:03 +02:00			`* A double enter will end them`
Fix demo text 2015-06-27 21:47:13 +02:00			`* Tabs and shift-tabs work too`
Update default text and styling 2015-06-22 23:14:03 +02:00
Decrease header size 2015-06-22 23:17:55 +02:00			`#### Ordered`
Add default text 2015-06-22 22:41:34 +02:00			`1. Numbered lists...`
			`2. ...work too!`

			`## What about images?`
Use HTTPS for Imgur to avoid mixed content While we're at it, change the link to Google to HTTPS too. 2016-11-01 06:57:34 +01:00			`![Yes](https://i.imgur.com/sZlktY7.png)</textarea>`
Create gh-pages branch via GitHub 2015-06-19 22:18:14 +02:00
Add H1s for clarity 2015-06-27 21:45:33 +02:00			`<h1><a id="h1_demo2" class="anchor" href="#h1_demo2" aria-hidden="true"><span class="octicon octicon-link"></span></a>Autosaving</h1>`

Show different options on the demo 2015-06-27 21:40:19 +02:00			`<textarea id="demo2"># This one autosaves!`
			`By default, it saves every 10 seconds, but this can be changed. When this textarea is included in a form, it will automatically forget the saved value when the form is submitted.</textarea>`

Add H1s for clarity 2015-06-27 21:45:33 +02:00			`<h1><a id="h1_demo3" class="anchor" href="#h1_demo3" aria-hidden="true"><span class="octicon octicon-link"></span></a>Hidden toolbar and status bar</h1>`

Show different options on the demo 2015-06-27 21:40:19 +02:00			`<textarea id="demo3"># This one is bare`
Spell checker improvements 2015-07-21 06:37:33 +02:00			`You can also choose to hide the statusbar and/or toolbar for a simple and clean appearance. This one also checks for misspelled words as you type!</textarea>`
Show different options on the demo 2015-06-27 21:40:19 +02:00
Add textarea 2015-06-22 22:24:08 +02:00			`<footer class="site-footer">`
Update company name 2017-05-16 21:07:58 +02:00			`<span class="site-footer-credits"><a href="https://github.com/sparksuite/simplemde-markdown-editor">SimpleMDE Markdown Editor</a> is created and maintained by <a href="https://github.com/sparksuite">Sparksuite</a></span>`
Add textarea 2015-06-22 22:24:08 +02:00			`</footer>`
Create gh-pages branch via GitHub 2015-06-19 22:18:14 +02:00
Add textarea 2015-06-22 22:24:08 +02:00			`</section>`
Create gh-pages branch via GitHub 2015-06-19 22:18:14 +02:00
Change to https always 2015-07-21 17:04:32 +02:00			`<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css">`
			`<link rel="stylesheet" href="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.css">`
			`<script src="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.js"></script>`
Add textarea 2015-06-22 22:24:08 +02:00
			`<script>`
Remove development code, Add autosave to demo 2015-06-26 23:14:19 +02:00			`new SimpleMDE({`
Fix JS bug 2015-06-27 21:41:35 +02:00			`element: document.getElementById("demo1"),`
Spell checker improvements 2015-07-21 06:37:33 +02:00			`spellChecker: false,`
Show different options on the demo 2015-06-27 21:40:19 +02:00			`});`

			`new SimpleMDE({`
Fix JS bug 2015-06-27 21:41:35 +02:00			`element: document.getElementById("demo2"),`
Spell checker improvements 2015-07-21 06:37:33 +02:00			`spellChecker: false,`
Remove development code, Add autosave to demo 2015-06-26 23:14:19 +02:00			`autosave: {`
			`enabled: true,`
Show different options on the demo 2015-06-27 21:40:19 +02:00			`unique_id: "demo2",`
Remove development code, Add autosave to demo 2015-06-26 23:14:19 +02:00			`},`
			`});`
Show different options on the demo 2015-06-27 21:40:19 +02:00
			`new SimpleMDE({`
Fix JS bug 2015-06-27 21:41:35 +02:00			`element: document.getElementById("demo3"),`
Show different options on the demo 2015-06-27 21:40:19 +02:00			`status: false,`
			`toolbar: false,`
			`});`
Add textarea 2015-06-22 22:24:08 +02:00			`</script>`
Add GA code 2015-06-23 02:06:34 +02:00
			`<script>`
			`(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]\|\|function(){`
			`(i[r].q=i[r].q\|\|[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),`
			`m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)`
			`})(window,document,'script','//www.google-analytics.com/analytics.js','ga');`

			`ga('create', 'UA-5808021-18', 'auto');`
			`ga('send', 'pageview');`

			`</script>`
Create gh-pages branch via GitHub 2015-06-19 22:18:14 +02:00			`</body>`
			`</html>`