• Members 148 posts
    Feb. 1, 2023, 10:52 a.m.

    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?

  • Feb. 1, 2023, 2:17 p.m.
    check_box

    Marked as best answer by Feb. 1, 2023, 5:31 p.m..

    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)
    
  • Members 148 posts
    Feb. 1, 2023, 5:34 p.m.

    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?

  • Feb. 1, 2023, 5:48 p.m.

    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 
    
  • Members 148 posts
    Feb. 7, 2023, 11:12 a.m.

    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

    Supported Github Flavoured Markdown Cheat Sheet

    How have I done inline code highlighting?

    How have I done `inline code highlighting`?
    

    Heading 1

    Heading 2

    Heading 3

    Heading 4

    Heading 5
    Heading 6

    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~~
    

    • Hi
    • How
    • Are
    • You?

    How?

    * Hi
    * How 
    * Are 
    * You?
    

    What about ordered list?

    1. One (Hi)
    2. Two (How)
    3. Three (Are)
    4. Four (You)

    How?

    1. One (Hi)
    2. Two (How)
    3. Three (Are)
    4. Four (You)
    

    Complex

    1. Level 1
    2. Level 2
      • Level 3
      • Level 4
        • Level 5

    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:

    TalkBack Community

    How?

    ![alt text](https://talkcab.trentend.uk/media/conf/logo.549da21a.png "title here")
    

    Another way:

    ![alt text][id]
    [id]: https://talkcab.trentend.uk/media/conf/logo.549da21a.png "title here"


    Link:

    Github

    How?

    [Github](http://github.com "title here")
    

    Another way:

    [github][id2]
    [id2]: http://github.com "title here"


    Automatic Links? (Yeah)

    github.com

    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?

    • You can highlight code with 4 spaces or with ```(language-name(optional)).

    Highlight without any language syntax

    " ```
      <-- code here -->
      ``` "
    
    • This will just wrap code in pre tag.
    • Ignore " because It's not showing alone, So I've to use it.

    Highlight with any language syntax

    " ```html
      <-- code here -->
      ``` "
    
    • I've written html because I want to highlight html code.
    • You can use other languages, For example: scss, sass, python, ruby, javascript, jade, less, php etc.
    • Ignore " 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")

  • Members 148 posts
    Feb. 7, 2023, 11:18 a.m.
  • Feb. 7, 2023, 12:46 p.m.

    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.

    www.youtube.com/watch?v=55CyNweAIlg

  • Members 148 posts
    Feb. 7, 2023, 1:14 p.m.

    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:

    youtu.be/9bTWF7eirJw

  • Feb. 7, 2023, 1:21 p.m.

    Noted, I'll see what can be done about this in future release :]

  • March 2, 2023, 3:05 p.m.

    For the record, there’s formatting help modal coming in future Misago release:

    15B3E040-8B87-42B7-99C9-766E1070367A.jpeg

    15B3E040-8B87-42B7-99C9-766E1070367A.jpeg

    JPG, 70.8 KB, uploaded by rafalp on March 2, 2023.

  • March 10, 2023, 10:49 p.m.

    YouTube videos not playing has been fixed.