# Unformatted Code Detector

**URL:** https://meta.discourse.org/t/unformatted-code-detector/112773
**Category:** Theme component
**Tags:** official, unformatted-code-detector
**Created:** [March 28, 2019, 4:21am UTC](https://meta.discourse.org/t/unformatted-code-detector/112773 "2019-03-28T04:21:55Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![Discourse](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/discourse/32/148734_2.png) [@Discourse](https://meta.discourse.org/u/Discourse)
#### Post date: [March 28, 2019, 4:21am UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/1 "2019-03-28T04:21:55Z")

</div>

| | | |
| --- | --- | --- |
| :discourse2: | **Summary** | **Unformatted Code Detector** detects unformatted code and gives a warning before posting. |
| :eyeglasses: | **Preview** | [Preview on Discourse Theme Creator](https://discourse.theme-creator.io/theme/Discourse/unformatted-code-detector) |
| :hammer_and_wrench: | **Repository Link** | [https://github.com/discourse/unformatted-code-detector](https://github.com/discourse/unformatted-code-detector) |
| :open_book: | **New to Discourse Themes?** | [Beginner’s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) |

Install this theme component

> [@](#):
>
> :discourse2: As this is an #official theme component maintained by the Discourse team, #Support, #Contribute > Bug, #Contribute > UX, and #Contribute > Feature requests can be made in the respective categories here on Meta, and tagged with the appropriate theme component tag. Click on a link below to get one started. :+1:
> 
> [:question:&nbsp; **Support**](https://meta.discourse.org/new-topic?category_id=6&tags=unformatted-code-detector "Ask for support on configuring and using Unformatted Code Detector") [:bug:&nbsp; **Bug**](https://meta.discourse.org/new-topic?category_id=1&tags=unformatted-code-detector "A bug report means something is broken, preventing normal/typical use of the theme component") [:eyes:&nbsp; **UX**](https://meta.discourse.org/new-topic?category_id=9&tags=unformatted-code-detector "Discussion about the user interface of Unformatted Code Detector, and how features are presented (including language and UI elements)") [:bulb:&nbsp; **Feature**](https://meta.discourse.org/new-topic?category_id=2&tags=unformatted-code-detector "Discussion about how existing Unformatted Code Detector features can be improved or enhanced, and how proposed new features could work")

### Features

Users posting unformatted code will see a warning message instructing them how to format it correctly.

 ![Unformatted Code Detector](https://global.discourse-cdn.com/meta/original/3X/6/2/624f9c962a946aaca83e69be73a30f3346e08a09.gif)

Sensitivity and whether it detects HTML are configurable via theme settings.

### Settings

| Name | Description |
| --- | --- |
| emoji icon | The emoji icon to be displayed next to the title in the unformatted warning modal. |
| disable at trust level | Disable warning for users with a trust level of N or higher. -1 = enabled for all users. |
| sensitivity | Sensitivity of the detection algorithm. 0 = plugin disabled; 1 = warn for anything that looks even slightly like code. |
| min post length to check | Minimum post length to check (number of characters) |
| max post length to check | Maximum post length to check (number of characters). -1 = no maximum. |
| include html | Check for HTML tags as well as other types of code. Recommended to disable if users frequently need to render custom HTML in their posts. |

| Translation | Default |
| --- | --- |
| warning\_modal.title | Are you posting code? |
| warning\_modal.content | It looks like your post may contain code or logs. To keep your post readable, please remember to **format your code** using the _Preformatted text_ toolbar button \</\>, or the backtick ` key on your keyboard, like so: [examples] |
| warning\_modal.do\_not\_show\_again | do not show this message again |
| warning\_modal.fix\_post | Edit Post |
| warning\_modal.ignore\_and\_post\_anyway | Post Anyway |

### Debugging

If you receive a warning for a post which doesn’t include any text, you can print debug information by opening the browser JS console, and typing `debugUnformattedCodeDetector()` Enter. This will print some information about which lines were considered ‘code’, and what the sensitivity settings are.

> :information_source: “Do not show this message again” only works per device, not per user. This is a known issue and will be fixed once Discourse gains the functionality to attach user info from themes.

  

> :discourse2: **Hosted by us?** Theme components are available to use on our Standard, Business, and Enterprise plans.

> Last edited by @JammyDodger 2024-06-16T11:48:08Z
> 
> > **Check document**
> >
> > Perform check on document:

---

<div class="post-metadata">

### Author: ![robbiet480](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/robbiet480/32/121789_2.png) [@robbiet480](https://meta.discourse.org/u/robbiet480)
#### Post date: [June 21, 2019, 7:45am UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/14 "2019-06-21T07:45:42Z")

</div>

We at the Home Assistant forums think that this is the best thing invented since sliced bread. Or maybe Home Assistant. Thank you so so much @lionel-rowe!!!

Two minor request:

- I don’t want to allow users to skip formatting or disable the dialog in the future. I want them to feel pain until they change their ways. I’m sadistic like that. Can you make the “Don’t show this message again” and “Post anyway” buttons optional? For now I’ve hid them with some CSS but would be better to just not include the HTML at all.

- Unsure if you are doing language detection or not, but if you are, can you add the estimated language name after the first code fence so that users will properly syntax highlight too?

Thanks so much!!

---

<div class="post-metadata">

### Author: ![lionel-rowe](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/lionel-rowe/32/134288_2.png) [@lionel-rowe](https://meta.discourse.org/u/lionel-rowe)
#### Post date: [June 21, 2019, 6:51pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/15 "2019-06-21T18:51:07Z")

</div>

> [@robbiet480](#):
>
> I don’t want to allow users to skip formatting or disable the dialog in the future. I want them to feel pain until they change their ways. I’m sadistic like that. Can you make the “Don’t show this message again” and “Post anyway” buttons optional? For now I’ve hid them with some CSS but would be better to just not include the HTML at all.

I wouldn’t recommend hiding them, especially if you leave the setting to include HTML detection on. Power users may still want to have their (sanitized) HTML parsed as such, not formatted as code. Two examples where this can be useful are `kbd` and `abbr` tags.

If you exclude HTML tags from detection (which may be viable depending on the scope of your forum), hiding the “don’t show this again” would probably be OK. I still wouldn’t recommend hiding the “post anyway”, though, because there are bound to still be some edge cases of false positives (I hit one the other day where I’d omitted a space before an opening parenthesis — poor typesetting, but not unformatted code). Then you’ll have a situation where users can’t post their question at all, and, unless they report the issue to you directly, you won’t even know about it.

> [@robbiet480](#):
>
> Unsure if you are doing language detection or not, but if you are, can you add the estimated language name after the first code fence so that users will properly syntax highlight too?

Language detection is beyond the scope of this component, I’m afraid. Where possible, it looks for syntactical features shared by many languages, such as lines ending in semicolons, certain configurations of curly braces, and so on.

I _am_ thinking about ways to enhance the UX, though. One big improvement would be to make it much more interactive. For example, instead of a simple modal, the user would be presented with a wizard that first asks them which language their post concerns (select from a dropdown), then a screen which asks them to select which ranges of their post are code (defaulting to lines that contain strings flagged by the plugin), then generating the appropriate markdown. This would still include a “skip and post anyway” option, though, for the reasons I mentioned.

I don’t have a timeline for this change, but it’d be good to know if it’s something people would be interested in.

---

<div class="post-metadata">

### Author: ![robbiet480](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/robbiet480/32/121789_2.png) [@robbiet480](https://meta.discourse.org/u/robbiet480)
#### Post date: [June 21, 2019, 7:20pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/16 "2019-06-21T19:20:29Z")

</div>

Already hit the edge cases issue within 30 minutes or so of hiding the elements, so they have been re-added.

I would be super interested in the modal being more interactive!

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [May 12, 2021, 8:23pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/27 "2021-05-12T20:23:46Z")

</div>

Quick note, we will be official-izing this component soon and working closely with @lionel-rowe and @david to get there. Any ideas or feedback, now is the time to share it!

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [July 30, 2024, 3:08pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/28 "2024-07-30T15:08:36Z")

</div>

2 posts were split to a new topic: [Emojis trigger code detector and ‘fix code’ doesn’t work](https://meta.discourse.org/t/emojis-trigger-code-detector-and-fix-code-doesnt-work/319264)

---

<div class="post-metadata">

### Author: ![tpetrov](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tpetrov/32/164643_2.png) [@tpetrov](https://meta.discourse.org/u/tpetrov)
#### Post date: [May 18, 2021, 11:29am UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/30 "2021-05-18T11:29:00Z")

</div>

> [@codinghorror](#):
>
> Quick note, we will be official-izing this component soon and working closely with @lionel-rowe and @david to get there. Any ideas or feedback, now is the time to share it!

Awesome news!

Not sure if it makes sense, but would be great if this could also alert on most common Markdown mistakes, that break the formatting.

---

<div class="post-metadata">

### Author: ![tpetrov](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tpetrov/32/164643_2.png) [@tpetrov](https://meta.discourse.org/u/tpetrov)
#### Post date: [May 18, 2021, 9:07pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/31 "2021-05-18T21:07:03Z")

</div>

It would also be great if there was a hint where the suspected unformatted code is.

I was just writing another reply and got the alert, although I haven’t pasted any code. After a while I realized it’s because I used the word `topic_id`… But it’s not obvious that the detector thinks this word is code (and most people wouldn’t think that) IMO.

I think that when a word has an underscore in it that doesn’t necessarily mean it’s code.

---

<div class="post-metadata">

### Author: ![lionel-rowe](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/lionel-rowe/32/134288_2.png) [@lionel-rowe](https://meta.discourse.org/u/lionel-rowe)
#### Post date: [May 18, 2021, 10:09pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/32 "2021-05-18T22:09:35Z")

</div>

Thanks for all your feedback so far folks! We’ll be adding and tweaking a few settings to reduce the oversensitivity of detection.

@tpetrov one other thing — does the wording of the popup make it clear that you can choose to ignore it and post anyway if you don’t think your post contains code? Or does it make it seem like you’re forced to find and “fix” the perceived problem?

---

<div class="post-metadata">

### Author: ![tpetrov](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tpetrov/32/164643_2.png) [@tpetrov](https://meta.discourse.org/u/tpetrov)
#### Post date: [May 19, 2021, 7:54am UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/33 "2021-05-19T07:54:36Z")

</div>

My concern is that a lot of people will not read through it…  
You know, when people see a popup with more than one sentence text nowadays, they seem to ignore the text and look for the button **Ok** (I accept cookies, terms, etc,).

Still, maybe “It looks like your post may contain unformatted code” could be changed to “Do you use code in your post?”, as sometimes questions draw more attention.

I’m not a UX expert, but this button seems a bit nuclear:  
 ![image](https://global.discourse-cdn.com/meta/original/3X/8/f/8f95821964042677651e3717ae4b434e19759462.png) - something I wouldn’t like to click. Which of course is the idea - that people will not simply skip it instead of trying to format their post better.

---

<div class="post-metadata">

### Author: ![mbauman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mbauman/32/139835_2.png) [@mbauman](https://meta.discourse.org/u/mbauman)
#### Post date: [May 19, 2021, 1:10pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/34 "2021-05-19T13:10:45Z")

</div>

Oooh, I like this idea… but I just got a false positive:

> [@Discobot tutorial generating modmail](https://meta.discourse.org/t/discobot-tutorial-generating-modmail/186896/2):
>
> It’s still early for our relatively small site but this is looking promising. In the month prior to changing this, 18 folks did that tutorial step and 4 flagged it wrong. In the month+ since 17 have done that step and 0 got it wrong. The new text adds a few more details about why you might flag a post but I’m guessing it’s the very small change to the final sentence that’s doing most of the work: We like our discussions friendly, and we need your help to keep things civilized. If you see a…

It might have been the broken links that tripped it up? They’re just taken from the templating engine and look like: `[keep things civilized](%{guidelines_url})`. Or maybe the HTML `img` tag?

---

<div class="post-metadata">

### Author: ![lionel-rowe](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/lionel-rowe/32/134288_2.png) [@lionel-rowe](https://meta.discourse.org/u/lionel-rowe)
#### Post date: [May 19, 2021, 3:49pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/35 "2021-05-19T15:49:51Z")

</div>

> [@tpetrov](#):
>
> Still, maybe “It looks like your post may contain unformatted code” could be changed to “Do you use code in your post?”, as sometimes questions draw more attention.

Not a bad idea, @david perhaps we can try changing the modal title to “Are you posting a code snippet?”

> [@tpetrov](#):
>
> I’m not a UX expert, but this button seems a bit nuclear:  
> ![image](https://global.discourse-cdn.com/meta/original/3X/8/f/8f95821964042677651e3717ae4b434e19759462.png) - something I wouldn’t like to click. Which of course is the idea - that people will not simply skip it instead of trying to format their post better.

I think you’re probably right. Next version will have that as a standard gray button.

> [@mbauman](#):
>
> It might have been the broken links that tripped it up? They’re just taken from the templating engine and look like: `[keep things civilized](%{guidelines_url})` . Or maybe the HTML `img` tag?

Turns out it was both! Next version with default settings will no longer trigger for this post.

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [May 22, 2021, 9:40pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/36 "2021-05-22T21:40:46Z")

</div>

We’re rolling out new copy, and building a corpus of positive and negative test sample posts for the component. Bear with us, as this is shaping up nicely!

---

<div class="post-metadata">

### Author: ![tmomas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tmomas/32/109144_2.png) [@tmomas](https://meta.discourse.org/u/tmomas)
#### Post date: [August 13, 2021, 8:19pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/43 "2021-08-13T20:19:29Z")

</div>

> [@codinghorror](#):
>
> Any ideas or feedback, now is the time to share it!

Minor nitpick: The default for the warning\_modal.content is asking for the “code” toolbar button, but this button is called the “Preformatted text” button in the editor when you hover over it with your mouse.

![grafik](https://global.discourse-cdn.com/meta/original/3X/3/7/37de083986e77512baf7a36ff05383e83ffe7a29.png)

![grafik](https://global.discourse-cdn.com/meta/original/3X/6/1/611681a8fa91ee2c97dc9a417f439bedb6a2d856.png)

To make it easier for new users to find this button (they will not find any code button), the warning\_modal.content should be changed from “code button” → “Preformatted text button”.

---

<div class="post-metadata">

### Author: ![tmomas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tmomas/32/109144_2.png) [@tmomas](https://meta.discourse.org/u/tmomas)
#### Post date: [August 13, 2021, 8:34pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/44 "2021-08-13T20:34:04Z")

</div>

How can I add a link to a topic with further examples and instructions?

I tried simply adding it at the end of warning\_modal.content, but that resulted in this (my additions marked yellow):

 ![grafik](https://global.discourse-cdn.com/meta/original/3X/b/b/bbbb73d27f64dd6d323e9060ec1711f8a64c3ab0.png)

How can I add some text and a link below the the current content?

 ![grafik](https://global.discourse-cdn.com/meta/original/3X/a/a/aacae7f75f7854e7fa4aa04030b956c1e4fabca2.png)

Edit:

I just noticed that changing even a single character in warning\_modal.content breaks the formatting.

 ![grafik](https://global.discourse-cdn.com/meta/original/3X/f/1/f1657f1723586c504cf6fed0828ddc416dd6e7a0.png)

Even worse: Just clicking into the warning\_modal.content input field and then moving the cursor by the arrow keys makes the input field highlighted. After clicking the green checkmark to save the “edited” warning\_modal.content (no change at all has been done, just moving the cursor one character), the formatting is broken as shown above.

Edit # 2

**Solved** with the help of [https://meta.stackexchange.com/questions/82718/how-do-i-escape-a-backtick-within-in-line-code-in-markdown](https://meta.stackexchange.com/questions/82718/how-do-i-escape-a-backtick-within-in-line-code-in-markdown)

@codinghorror @lionel-rowe Maybe you should look into this and adjust the default warning\_modal.content accordingly regarding spaces and backticks (missing spaces within the heavily with backticks equipped “multiplelines” section were causing the problems described above).

---

<div class="post-metadata">

### Author: ![tmomas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tmomas/32/109144_2.png) [@tmomas](https://meta.discourse.org/u/tmomas)
#### Post date: [August 14, 2021, 12:16pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/45 "2021-08-14T12:16:20Z")

</div>

Is there any way we can make it more clear to the user which key to chose for the code fences if he is doing it manually (i.e. not via the button)?

Today I have seen this:

 ![grafik](https://global.discourse-cdn.com/meta/original/3X/a/a/aa65f2224caf1f770982130f038461fb7d623912.png)

The user obviously tried to follow the instructions, but chose the wrong key for the code fences ( `'` instead of ```). In the past I have also seen `...` instead of `````. Both cases indicate that users need more explicit instructions which key to choose.

Alternatively: Don’t confuse users with those keys and just say: Use the “Preformatted text” button and you are done.

* * *

@lionel-rowe How can I customize the detection behaviour?

Currently the [shebang](https://en.wikipedia.org/wiki/Shebang_(Unix)#Examples) is not detected as code, and I would like to change this.

Expected behaviour: `#!` indicates the beginning of a script and therefore should be detected as code.

Example for non-detection:

* * *

#!/bin/sh

echo “test”

. /lib/upgrade/common.sh

firmware=“/tmp/firmware.img”  
tmpdir=“/tmp/\_upgrade”  
output=“/dev/ttyS0”  
before=“before-upgrade.sh”  
after=“after-upgrade.sh”

* * *

In addition to this, it would be useful for us if `root@` would be detected as code.

root@OpenWrt:~# ip link add link eth0 name eth0.9 type vlan id 9  
root@OpenWrt:~# brctl addbr br-foo  
root@OpenWrt:~# brctl addif br-foo eth0.9  
root@OpenWrt:~# ip link set eth0.9 up  
root@OpenWrt:~# ip link set br-foo up

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [August 26, 2021, 5:47pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/46 "2021-08-26T17:47:02Z")

</div>

> [@tmomas](#):
>
> In addition to this, it would be useful for us if `root@` would be detected as code.

@david is there a way to customize the detection?

---

<div class="post-metadata">

### Author: ![david](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/david/32/157490_2.png) [@david](https://meta.discourse.org/u/david)
#### Post date: [August 30, 2021, 2:42pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/47 "2021-08-30T14:42:59Z")

</div>

There isn’t any way to have per-site customizations at the moment, no. We could certainly look at adding shebang and shell prompt detection to the ‘code energy’ system though.

---

<div class="post-metadata">

### Author: ![david](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/david/32/157490_2.png) [@david](https://meta.discourse.org/u/david)
#### Post date: [September 13, 2021, 4:56pm UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/48 "2021-09-13T16:56:02Z")

</div>

> [@tmomas](#):
>
> Just clicking into the warning\_modal.content input field and then moving the cursor by the arrow keys makes the input field highlighted. After clicking the green checkmark to save the “edited” warning\_modal.content (no change at all has been done, just moving the cursor one character), the formatting is broken as shown above.

Thanks for raising this - looks like a core bug with multiline theme translations. I’ve made a PR to fix:

[https://github.com/discourse/discourse/pull/14322](https://github.com/discourse/discourse/pull/14322)

---

<div class="post-metadata">

### Author: ![hhlp](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/hhlp/32/124988_2.png) [@hhlp](https://meta.discourse.org/u/hhlp)
#### Post date: [October 28, 2021, 10:34am UTC](https://meta.discourse.org/t/unformatted-code-detector/112773/49 "2021-10-28T10:34:16Z")

</div>

Most of Discourse sites use discourse as a troubleshoting tools, Is this plug-in is suitable for the following tasks?, not only for code:

Linux:

- Logs
- Linux Command CLI
- Terminal Output

For Example:

```plaintext
Sensors:
  System Temperatures: cpu: 78.0 C mobo: 36.0 C gpu: nouveau temp: 56.0 C 
  Fan Speeds (RPM): cpu: 0 fan-1: 3139 fan-3: 0 fan-5: 0 
  Power: 12v: N/A 5v: 2.90 3.3v: N/A vbat: 3.34 

```

Regards.,

[Next page](https://meta.discourse.org/t/unformatted-code-detector/112773.md?page=2)
