-
Notifications
You must be signed in to change notification settings - Fork 220
Markdown Formatting
More and more often, I'm tripping over some badly formatted descriptions or comments. But there are many, many possibilities to make your text/code more readable! This article will concentrate on different features provided in Codewars' Editor and show some examples!
Besides the classic HTML tags there are a plenty of shortcut, which provide the same functionality. Nevertheless, you can use HTML tags. The editing mode using these shortcuts is called Markdown.
The following listing will show the most useful shortcuts.
Using headlines is very useful, especially when you are creating a kata's description! The special character for headlines is the hash #. You just have to place 1-6 # in front of your text. The amount of # decides whether the headline is greater (1-3) or smaller (4-6).
Here some examples:
Note: There has to be a whitespace between the # and your text.
Often it is useful to highlight some text to show what is really important. Therefore, we are able to apply common formats (bold or italic) to what we have written. To write in an italic font you just have to place your text between asterisks * or underscores _. If you know this, writing in a bold font is very simple: Just just have to use two asterisk or underscores!
Keep this in mind when you write down some keywords the next time!
Here some more examples:
*value* or _value_ will look like this value
**value** or __value__ will look like this value
You can also combine them! Just use * or _ three times:
***value*** or ___value___ will look like this value
Imagine this: You're working on a difficult kata and you don't know why your code isn't working as expected. You've spent already 2 hours in console outputs to analyse your code, but you still don't have a clue what's wrong! Now you decide to post your solution as a comment. So you just copy and paste it into the comment box. Now your post looks something like this:
function myFunction(array) {
console.log('This is badly formatted');
}
Nobody enjoys reading this. And if the code is even more complex, nobody will be able to help you. So why don't we format this like code? Look, it works like this:
If you want to show the name of a variable, you just have to put it in between two single backticks. For example :
`var i` should equal 0
... gets formatted as ...
var ishould equal 0
If you want to highlight your code like it's done when your coding Javascript, Python, C# or something else, you have to write it like this. Watch closely!
```javascript
console.log("This is Javascript code");
```
... will look like ...
console.log("This is Javascript code");At Codewars.com this works for clojure, coffeescript, csharp, haskell, java, javascript, python and ruby, fsharp, c, cpp, etc.
This feature is completely unique to Codewars. It takes the block formatting syntax and makes it possible to only include the content if the selected language is or is not active.
Note: This feature is for kata markdown only, not comments.
For example, say you have a kata that supports 3 languages, JavaScript, Ruby and C#. You would like to include special instructions only for C# users and special instructions only for JavaScript and Ruby users. You could do it like so:
This is some shared instructions.
```if:javascript,ruby
This is only shown to JavaScript and Ruby users
- markdown is supported inside of here
- you can even include code blocks by using the alternate ~~~ format instead of ```
```
```if:csharp
this is only shown to C# users
```
You can also use if-not. Multiple languages can be targetted. The contents within the code block are considered markdown.
At some point you need to refer to something written by someone else. At this point you should use blockquotes! A blockquote is initialized with a > with a whitespace in front of your text. It will be shown like inlined text. You've already seen blockquotes. This page is using them a lot! Write them like this:
> Some blockquote
Note: There has to be a whitespace between the
>and your text.
If you want to link a user to this page, feel free to use the following snippets:
@---: To increase the readability of comments or descriptions, see [this page in the github wiki](https://github.com/Codewars/codewars.com/wiki/Markdown-Formatting).
For more information you may visit these official pages: