Does anyone know how to make a post like this?

Derenik·2/23/2015, 11:08:27 PM·1 votes·1,684 views
[Champion Concept] - Kay'Ohe, the Sower of Corruption

Hi, Not very good with the HTML and such, so was wondering if someone can tell me, if it's easy, how to make a post like this?

Would specifically want to know how you put a picture or icon next to a text.

Thanks for the help.

13 Comments

MXXIV2/24/2015, 4:38:24 PM5 votes

The syntax used here is called Markdown. Sadly, board developers have cut away many of markdown's great features, leaving you with but a few options. Specifically, these things are not included in the editor:


#Heading

#Heading

Begin line with hashtag (#) to make a heading.

#Heading level 2

##Heading level 2

Second level heading. There's also 3rd level with three hashtags.

#Horizontal line

---

Use three commas to display horizontal line.

#Images (disabled by forum developers because they think they can do better)

!DESCRIPTION

Markdown has it's own, very reliable syntax for adding images. Instead, insert image url directly in the text. Usually, it renders properly. Of course, images with spaces in the URL will not work, replace spaces with %20.


#Nested lists

[SPACE]\1. item level 1 [SPACE][SPACE]\1. item level 2 [SPACE]\2. Item level 1

  1. item level 1
  2. item level 2
  3. Item level 1

There can be at least 3 levels of nesting, just add more spaces. My test:

  • 1
    • 2
      • 3
        • 4
          • 5
            • 6

#Disable formatting characters

\*no bold here\*

Put backslash before any functional character (*, _, [, ], --- and so on) to have it rendered normally.

#Text style

  1. *italic*
  2. **bold**
  3. ***both***
  4. ~~strikethrough~~
  1. italic
  2. bold
  3. both
  4. strikethrough

#Getting post source code

Two ways:

  1. Quote the post. Anything quoted will remain hidden for you
  2. Copy some unique word (or words) from post. Then press CTRL+U for page source code. Then find the post source by CTRL+F. Thank retarded boards developers for parsing Markdown by javascript (that's why page lags after loading btw).
DrCyanide2/23/2015, 11:43:48 PM2 votes

I'm not perfect at this stuff, but I know some things.

First off, this isn't done with HTML. I don't know what it's called, but it's not HTML.


See that line? That was made by typing ---

Wow, that's cool! But how did you type it the second time? Shouldn't it have made a dash?

To prevent something from being 'translated' as formatting, put a \ in font of it. FYI you can make the quote box with > before the text.

## makes nice bold headers.

**makes normal bold text **

make italicized text using *words go here*

***Do both at the same time! *** using ***words go here ***

Note: it looks like italic phrases don't like escaping the *.

words You can cross out words with ~~ on both sides. Again, this one doesn't like the escape character.

Pictures are really easy to include in general. Just paste in the link to your image. I don't know how they got the image next to the text, but it might be that they didn't put the URL on a new line.

  • bullet lists start with a * followed by a space. Note that there has to be an empty line above it.
  • bullet points under the first don't need the extra line
  1. Numbered lists follow the same rules
  2. There is a problem with numbered lists, in that you could put 1. For every point and it would get translated to the next number.

Example:

  1. My first point is this

And

  1. My second point is this

See the screenshot I attached. I know some people can insert the attachments in line, but I'm not sure how they do it.

Hyrum Graff2/24/2015, 2:57:06 AM2 votes

The formatting is called Markdown.

http://hydra-media.cursecdn.com/wow.gamepedia.com/2/25/Ability_warlock_jinx.png?version=5b3ce37a19b045775a94a710be82dc24 Test

Yeah, images on the same line just by typing after the URL. Quote this post if you want to see how I did that, exactly. If you have any other questions, I'd be happy to answer them (I've been using this platform for a long time).

Derenik2/23/2015, 11:49:48 PM1 votes

Ah, great help, thanks!