Markdown & HTML Code Guide for Beginners that includes 5 Useful Tips to edit Posts & Comments using Steemit's Raw Editor; Edit & Align Text, Columns, Table and Smiley'ssteemCreated with Sketch.

in steemit •  last year

This Post is dedicated to all those new Users who recently joined Steemit and have no idea how to utilize the Raw Markdown Editor in order to edit Posts or Comments

When you decide to write out a post, you'll notice that there 2 options on the top right corner that enables you to switch between the built-in Editor or Raw Editor!

The Built-in Editor Is Simple and Easy to Use! If you're really desperate to start publishing content on Steemit this is for you! You won't need much for an ''Introduceyourself'' Post but as you begin to write more content you'll definitely want to familiarize yourself with Markdown & HTML Coding

I can understand that many of you, do not like the slightest idea of learning to code. You should at least give it a try! as there is possibility of getting rewarded by the Community! If your post has interesting Content and appealing layout it is bound to get more upvotes from the Steemit Community, so it pays to learn how to edit or format your Post & Comments

The Raw Editor allows you to edit content through Markdown and HTML Codes. Both of them are consider to be Mark Up Language

What is a Mark Up Language?

Markup languages are designed for the processing, definition and presentation of text. The language specifies code for formatting, both the layout and style, within a text file. The code used to specify the formatting are called tags. HTMLis a an example of a widely known and used markup language

Markdown is a lightweight markup language with plain text formatting syntax designed so that it can be converted to HTML and many other formats using a tool by the same name

HTML (Hypertext Markup Language) is the set of markup symbols or codes inserted in a file intended for display on a World Wide Web browser page. ... Each individual markup code is referred to as an element (but many people also refer to it as a tag)

5 Beginner Tips

1) Make Text Bold or Italic


Visit This Post for More Information

2) How to Align Text to the Right & Left

If you spot an error in any of my Guides please feel free to correct me and also if there is anything you would like to see a Guide on, let me know! Dedicated young Steemian interested in getting Vested. Will write another tip on Markdown Codes Soon, Follow me for more!

Visit This Post for More Information

3) Insert Table


Raw Editor Input Code

Graphical Content| Data Visualization|
Visualization of statistics| Word Summary|

Visit This Post For More Information

4)Insert smiley's & Icons


😉 WinK&#128521
😊 Smile&#128522
😠 Angry&#128544
😜 Tongue&#128540
😧 Surprised&#128551
😱 Scream&#128561
😆 LOL&#128518
😎 Glasses&#128526
😍 Heart Eyes&#128525
😭 Crying&#128557
😞 Sad&#128542
😶 No Words&#128566
😇 Angel&#128519
😈 Devil&#128520
😵 Dizzy&#128565

Visit This Post for More Information

5) Format Text Into Columns


2 Columns

Long lines of text can be hard to read, so doing multiple columns breaks the lines up to something more optimal. In type-setting there is actually a sweet spot between too short lines (eyes have to constantly jump lines) and too long lines (when jumping a line it's hard to figure out which line is the next one and not accidentally skip a line).
It was shown, by experiment, that optimal amount of text for print material is ~60 characters per column. Higher amount of characters per column interferes with brain's ability to scan through text easily, much like you need to break text into paragraphs for same reason
>An alternative method to Display Content

You can simply copy paste the code below into your Raw Editor and change my Text!

<div class=pull-left>
Write you first Column Text right here followed by closing Markdown Code
<div class=pull-right>
Now write the Text of your 2nd Column, keep in mind that some Markdown Styling won't Work

Visit This Post for More Information


I will contiune to write more Guides and Tutorials about Steemit, feel free to follow me! Also let me know if there is any particular Topic about Steemit that you want me to write about! This Post is intended to sum up some of previous Guides & Tutorials that I have written, since Steemit is still a new platform many users have yet to join! So this should be the best time to write educational content for so called Newbies. I will get more Technical with Steemit as time passes, because i'm constantly learning more about this special Social Platform. Dedicated to write more educational content so feel free to give me an Upvote or better follow me, much appreciated!

Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  trending

This is a very helpful post


👍💥Best Styling guides for your steemit💌 posts

multi columns,
decorative images,
formatting texts,
styling comments,
gif images

You can also make columns on comments like below .


1151420 - Copy.png



If you want to learn how to style your posts like this , Upvote upcds.gif and follow me !

💃 @ladyluck

Thank you for reading! follow


I have a question, nothing to do with your subject, but I'm hoping you know who can answer the question.

I have been using for uploading my images. I was worried that if they close down someday, the images will no longer be available for my posts here. Another steemian reassured me the images are already on blockchain, but I had already asked if anyone knows an image site which is on blockchain.

A message was passed on to me from support team, asking if I can advise them on how to get onto blockchain.

I am so ignorant that it is painful, so I'm looking for help. It also struck me that there might be some way Steemit top guys can arrange something with so that both parties benefit. support team are contactable at or send me a message on any of my posts.

Can you pass on this message to the right people?



Everything we do/type on Steemit is on the SteemIt blockchain....your posts are on the blockchain...your comments are on the any images you've uploaded are also on the blockchain & can be found where ever you post them & I think that's what the person telling you that meant. As for moving a site/business onto a blockchain, one would need to know/understand the differences in the types of blockchains out there & decide if they want to build onto that or create their own (you need real pros to do this or be a programmer type yourself). For more in depth you'll prob need to sit down with google for a bit as it would take too much time to get into what you're asking I think. Good luck!


Great article, thank you! How do you make this fancy down line with the upvote blinking, resteem, comment and steemit logo? It is very cool, I want such for me too :)

very usefuls 😎


Indeed the post is quite enlightening

Thank you for such a helpful post

Like I've always said, you can never have enough Markdown guides. ;)

Are the Emoji still part of the current &#128526 ;



yes, they are all still functions properly 😎


The article was helpful. Now I know how to write Emoji's online. Thank you 😊

Awesome post! I'm a beginner to the platform and the examples in this post really helped me construct my first post. Keep up the good werk!

I dont have the raw html button. i am seeing hundreds and soon i bet thousands of how to steem posts.. this is starting to get really frustrating. there should be a simple section for how to's.

Thanks heaps, steemitguide. I've had centering and headings nailed for a while but struggle with left/right justifying images next to text and never even considered columns of text.
You've given me some valuable tips.

Great work! Thanks for the detailed explanation

Do you know how to paste code in a comment so the code is visible instead of interpreted? Much like you pasted your code examples in the article.


For easist way just click editor and write the code. Then turn back html.
Or else
& l t ; without spaces gives <
& g t ; without spaces gives >

good :)

Mark this as my guidance! thanks

Thank you so much for explaining how to add icons!!!!!!

Upvoted and resteeemed.

Steem on,

Very Helpful.. As I know the HTML is only for Preview Purposes? I use by the way but when Paste into Steem just get crazy... I mean..the symbols and the markup code is showned in the Post.. a Shame.

Thanks if any additional info.

Me parece excelente soy una newbies, y me preocupa la estetica de mis articulos prefiero aprender al mismo tiempo escribo pero para publicarlos, aprendere tus consejos me parece excelente seguir los pasos de personas que ya han recorido un camino en esta plataforma¡

helpful post upvoted

Thank for your job! It's helpful.

So useful 😆

Thanks!! Very useful!!!

Where do you put the code?
In WP for example, there is the visual editor & the code editor. Where is the code editor in Steemit?
For example...
How do I

Can I insert iFrames?
Can I hyperlink?



When posting, you choose to use normal Editor (includes bold, italic and hyperlink) or use the ''Raw Markdown'' Editor, just follow some of my guides on Markdown. It's quite simple, give it a go!

Thank you @steemitguide, helped me setting up my first post. I kinda like the two columns and will continue adapting it for bilingual posts.


For some reason Underline Text < u > </ u > is not working, super strange. Any idea why?
alt text

Thanks for this post, very helpful!

Where can I find some pure raw input code? Since I have problems with links as well as uploading pictures or including a full tweet ? Thanks in advance.

Very helpful for me Thanks!; 😊

Awesome work 😉