Add Floor Number Display to Discourse Replies

[haozi (耗子)]

I saw someone mention this today, so I spent some time researching it and finally got it working.

Add the following code in Custom - Head:

<script type="text/discourse-plugin" version="0.8">
    api.decorateWidget('post-meta-data:after', helper => {
        const sup = helper.h('sup', '#');
        return helper.h('div.post-number', [`${helper.attrs.post_number}`, sup]);
    });
</script>

After saving and refreshing the post, you can see the post numbers, but they don’t look very nice. Next, add this CSS:

/* Post number display */
.post-number {
    font-size: small;
    color: #66ccff;
    padding-left: 5px;
    font-weight: 700
}

Save again and it’s all done. You can refer to this site for the effect.

[XiaZhai (榎宅)]

I’ll try

[XiaZhai (榎宅)]

How should I put it, it’s a little weird

[haozi (耗子)]

I used that sup structure to create superscript, and it works normally once that structure is removed.