I'm just playing around with a test site, testing the features I need. I'm struggling with tables in markdown. I thought the site used github flavoured markdown, but I can't seem to make table as I would expect.
What is the flavour(version) that misago stable uses, and are tables possible?
Misago supports subset of GtHub flavored markdown and some BBCode.
Tables are not enabled by default, but can be enabled with a plugin. Luckily Markdown implementation we are using already has tables extension: github.com/Python-Markdown/markdown/blob/master/markdown/extensions/tables.py
So to enable it you will have to create a plugin that uses markdown_extensions hook to register tables extension with Markdown parser. Probably something like this;
from markdown.extensions.tables import TableExtension
def extend_markdown(md):
table_extension = TableExtension()
table_extension.extendMarkdown(md)
Thanks for that, I shall give it a go.
Is there a resource that documents the subset that misago uses, and one that shows what is actually available?
Misago supports what editor enables you to insert into posts plus:
Short syntax for quotes:
> Some quote
Ordered and unordered lists:
1. Lorem
2. Ipsum
3. Dolor
- Lorem
- Ipsum
- Dolor
Headers:
# Header 1
## Header 2
### Header 3
#### Header 4
##### Header 5
In-line code:
Lorem ipsum `dolor met` sit amet.
Mentions:
Hello, @tetricky
I've done a quick test on supported github flavoured markdown, and come up with this list. All I am short of for what I need is markdown table support (which I will have a go at trying to make a plugin for, although I would prefer it to be supported 'out of the box').
Youtube links that load elsewhere do not seem to autoload here.
www.youtube.com/watch?v=bsdcZhfgo90
How have I done inline code highlighting?
How have I done `inline code highlighting`?
How?
# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6
Blockquote ? Yes it is.
How?
> Blockquote ? Yes it is.
Strikethrough
How?
~~Strikethrough~~
How?
* Hi
* How
* Are
* You?
What about ordered list?
How?
1. One (Hi)
2. Two (How)
3. Three (Are)
4. Four (You)
Complex
How ?
1. Level 1
1. Level 2
+ Level 3
- Level 4
* Level 5
em tag
How?
*`em` tag*
strong tag
How?
**`strong` tag**
Noticed? Just written inline-code in em and strong tag.
If you want to produce * and _ then add \ before _ and *. So \* = * and \_ = _
If you want to produce __\*__ and **\_** then add `\` before `_` and `*`. So `\*` = \* and `\_` = \_
Image:
How?
Another way:
![alt text][id]
[id]: https://talkcab.trentend.uk/media/conf/logo.549da21a.png "title here"
Link:
How?
[Github](http://github.com "title here")
Another way:
[github][id2]
[id2]: http://github.com "title here"
Automatic Links? (Yeah)
How? just paste with the full url means with http:// or https://. e.g. http://github.com.
Code Highlighting
HTML
<body>
<div class="loader"></div>
<div class="pause">Click To Pause</div>
</body>
SCSS
$width: 7em;
$height: 3em;
$c-0: #34495e;
$c-1: lighten(#e74c3c,5%);
$c-2: lighten(#e67e22,5%);
$c-3: lighten(#f1c40f,5%);
label[for="checkbox"] {
font-size: 2em;
position: absolute;
margin-top: 0.2em;
text-transform: capitalize;
color: $c-0;
transition: all 0.5s ease-in-out;
}
input[type="checkbox"] {
appearance: none;
width: $width;
height: $height;
background: lighten($c-0,25%);
border-radius: $width / 2;
position: relative;
overflow: hidden;
outline: none;
transition: all 0.5s ease-in-out;
&:before {
width: $width / 2;
height: $height;
content: '';
position: absolute;
background: linear-gradient( lighten($c-1,17%), lighten($c-2,17%), lighten($c-3,17%) );
transition: all 0.5s ease-in-out;
}
&:checked {
&:before {
margin: 0 $width / 2;
}
background: lighten($c-0,35%);
opacity: 0;
~label[for="checkbox"] {
&:before {
transition: 0.5s all ease-in-out;
content: '';
position: absolute;
height: 0.5em;
width: 1em;
margin: -0.1em -2.0em;
box-shadow:
0.3em -0.1em 0 $c-0,
0.3em -0.2em 0 $c-0,
0.3em -0.1em 0 $c-0;
background: transparent;
transform: rotate(120deg);
}
}
}
}
CSS
@import url(http://fonts.googleapis.com/css?family=Source+Code+Pro);
body {
background: #eee;
}
.logo {
-webkit-animation-play-state: running !important;
animation-play-state: running !important;
font: bolder 4em 'Source Code Pro', sans-serif;
letter-spacing: -0.12em;
color: #ddd;
animation: shadow 2s linear infinite;
text-shadow: 1px 1px 3px grey, 2px 2px 4px lightgrey, 3px 3px 5px #aaa, 4px 4px 6px #aaa, 5px 5px 6px #bbb, 6px 6px 7px #ccc, 7px 7px 8px #ddd, 8px 8px 9px #eee;
}
@keyframes shadow {
to {
text-shadow: 8px 8px 9px #eee, 7px 7px 8px #ddd, 6px 6px 7px #ccc, 5px 5px 6px #bbb, 4px 4px 6px #aaa, 3px 3px 5px #aaa, 2px 2px 4px lightgrey, 1px 1px 3px grey;
color: grey;
}
}
How to highlight code?
Highlight without any language syntax
" ```
<-- code here -->
``` "
code in pre tag." because It's not showing alone, So I've to use it.Highlight with any language syntax
" ```html
<-- code here -->
``` "
html because I want to highlight html code.scss, sass, python, ruby, javascript, jade, less, php etc." because It's not showing alone, So I've to use it.Horizontal Line?
How?
This,
---
Resources - [Github Help on GFM] (help.github.com/articles/github-flavored-markdown "Help From Github on GFM"), [CSSDeck Docs] (cssdeck.com/labs/learning-the-markdown-syntax "Markdown Help")
On Youtube video's uploader may limit where video can be embed and where it can't. Your YT link shows "watch on youtube" which suggests it's embedding was restricted.
This is another example of video that limits embedding:
I don't know the implications of that, or how to work around it. If I look at this embedded video
<iframe width="678" height="523" src="https://www.youtube.com/embed/9bTWF7eirJw" title="Squeeze - Another Nail In My Heart" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
If I embedd the following link in my current forum, it embeds and will play there. If I link it here:
www.youtube.com/embed/9bTWF7eirJw
Without the embed, again it embeds correctly on my forum. Here:
Noted, I'll see what can be done about this in future release :]
For the record, there’s formatting help modal coming in future Misago release:
YouTube videos not playing has been fixed.
