Markdown Cheatsheet for Making Amazing Posts on Steemit

in #steem7 years ago (edited)

Hey everyone, yesterday I posted 5 tips on how to grow your Steemit account and I got a few more questions about how to make your articles better on Steemit. I decided to compile a little cheatsheet for editing your posts in the markdown editor!

Markdown Cheatsheet Table of Contents:

  1. Header Tags
  2. Strikethrough Text
  3. Bold & Italic Text
  4. Blockquote
  5. Lists
  6. Links
  7. Image Sizing
  8. Center Align Text or Images
  9. Tables


1. Header Tags

Code:

<h1> header text here </h1>
<h2> header text here </h2>
<h3> header text here </h3>
<h4> header text here </h4>
<h5> header text here </h5>
<h6> header text here </h6>

Example:

header 1

header 2

header 3

header 4

header 5

header 6



2. Strikethrough Text:

 

Code:

~~text~~

 

Example:

This is strikethrough text



3. Bold & Italic Text:

 

Code:

_This text is italic_
**This text is bold**
_**This text is bold & italic**_

 

Example:


This text is italic
This text is bold
This text is bold & italic



4. Blockquote

 

Code:

<blockquote> "This is a blockquote"</blockquote>

 

Example:

"This is a blockquote"


5. Lists

 

Code:

* This is a bulleted list
* This is a bulleted list
* This is a bulleted list

1. This is a numbered list
2. This is a numbered list
3. This is a numbered list

 

Example:

  • This is a bulleted list
  • This is a bulleted list
  • This is a bulleted list
  1. This is a numbered list
  2. This is a numbered list
  3. This is a numbered list


6. Links

 

Code:

[This is an inline-style link](https://steemit.com/@khaleelkazi)

 

Example:


This is an inline-style link



7. Image Sizing

 

Code:

https://steemitimages.com/300x800/yourimagelinkhere
Example:
https://steemitimages.com/300x800/https://steemitimages.com/DQmVR5t8KNisAZFWEn7hSMo26vV9g52cRJ4QkYzhLJnBzzD/image.png

 



8. Center Align

 

Code:

<center> insert your image or text here</center>

 

Example:


insert your image or text here



9. Tables

 

Code:

Tables | Are | A
--- | --- | ---
Great | Display | Tool
1 | 2 | 3

 

Example:

TablesAreA
GreatDisplayTool
123


Thanks for reading! I hope you find this info useful for making better posts on Steemit! There's a lot more info I have to share about the Markdown editor, so expect a part 2 soon!

If you have any questions or would like me to make a post about something specific, please let me know in the comments and I'll get right back to you!

Sort:  

(I am temporarly upvoting my comment for visibility)

This post is not bad... but there are like... 100 very similar tutorials on Steemit.

I will upvote 10 people, which will paste a link to similar tutorials as response to this comment:


https://steemit.com/steemit/@thecryptofiend/markdown-basics-for-beginners

The current post is not something that anyone should be reading.

Sure, there's 100s of similar tutorials on just about everything all over the internet. This tutorial is just 1 man's take on how to style articles in markdown and I made it to share with my followers.

On top of that as time goes by tutorials like this, and others talking about sp vs steem, or understanding voting power get buried by the new content.

Nothing wrong with these coming out on a regular basis to help the minnow learning curve

❤️

This blog is all about learning and sharing. And actually this is what I am learning. I don't know the markdown commands well and when I look at the Github page on markdown I get frustrated. This is simple and clean a tool I will refer to. I already changed the way I post after looking at this.

Thanks @mineopoly! I’m glad it’s helpful!

You are correct there are 100's if you know where & what to search. Here is one as an example as requested by @noisy. The problem is it was released a year ago and as a newbie sometimes we don't know what we don't know and even if we were to scroll through days of feeds there is no gaurantee we would stumble accros this. So I think it's good to rehash a few things time to time. Thanks for taking the time @khaleelkazi.

This is a great guide especially for those who aren't familiar with HTML.

I also use the "a href" tag as well:

https://www.w3schools.com/tags/att_a_href.asp

Thanks for this! It reminds me to use these more.

Thanks @sequentialvibe, I hope it helps a lot of people out!

excellent bro..very easy to understand ... too better than markdown styling guide on github...github is very complicated..

Thank you! I'm glad you like it!

K.. swag! Used your tips already making a link quote, excellent!! [link](htt blahblah) works perfect. I think new users will find this useful. There are many kinds of people and we can't always check old posts so it's good to remind people like me who really don't know how to use it.

Thanks @artjohn!! I’m glad I could help you with your links!! Posts look so much cleaner when you can do in-line linking!

An excellent resource for those of us just starting out, thank you, there were a few on here I didn't know about

Thanks! I'm glad it helps!

Right!! This is what I was waiting for. I used busy.org that had a lot of shortcuts made easy. Your post today is useful for people like me who don't use markdown enough. I will have to resteem this. Especially number 8 centering was what I had trouble with. This is the truth. I don't know these things well yet. But I miss your question at the end that gives a personal touch.^^

Haha I’m about to post with a QOTD soon for the article today! Thanks for sharing this post, I really appreciate it!

This is simple and clear. Thank you.

About sizing images - does this apply to both increasing and decreasing the sizes? And is there a limit?

Also, I've been trying to post a cartoon avatar I created on Portrait Illustrator Maker as my portrait but the url has repeatedly refused to load. Could you please advise on what I may be doing wrong?

Thanks for the kind words!

I've only ever needed to use the image resizing to decrease the size of an image. I don't think it works to increase the size of an image.

Could you paste the url in a reply here so I can test it out and then get back to you?

Thank you.
Alert: I'm terribly IT challenged. I don't know whether there's a specific url for a created image.

http://illustmaker.abi-station.com/index_en.shtml

I'm not 100% sure of how to use that, I think you need to save the image to your desktop and then copy/paste it into markdown. If you're trying to post it as your profile image on Steemit, then you need to paste it as a specific URL. The link you sent is to the editor itself, not your specific image. Hope that helps! Let me know if you get it working or have more questions.

That should help. Thank you.

Oh yes, it's very useful and justified, since your examples show specific steps for creating an excellent post! Thank you @khaleelkazi

Thank you for reading! I'm glad you find it useful!

Loading...

Didn't know about 2, 6, 7, and 9. This is gonna help a lot.

Have been using <a href='url link' thing for links. This is much easier :D

I’m glad you learned a few things! The in-line links are sooo much better than href! Thanks for reading!

Yeah it is! Really helping me save time on my postings :D

There are some like boarders when someone uses like a quote or a text from somewhere else. How do you do that?

Wow thanks for that list! I had no idea that you could do half of those things on here lol

Lol thanks for reading! I’m glad you learned a few tricks!!

Thanks for sharing the post, it's super helpful!

haha, I felt the same way when I read it!!

Thank you so much. Im ashamed to say I didn't even know what the markdown editor is, much less how to use it (I'm new to Steemit). This is going to help massively. I'm so glad I read this.

welcome to steemit! I’m glad you could learn a few things!! Thanks for reading!

You got a 48.77% upvote from @postpromoter courtesy of @khaleelkazi!

Thank you for letting me know this tips. They are very useful, and will make my articles look better! ;)

I’m glad they could help you out! Thanks for reading!

Good reference material for making better formatted posts. Thanks.

these recommendations you give us will be very useful to us

Great. As next please share the hidden secrets to get money into the wallet as well :)

Hahah I’ll look into writing a post about how to make money on steemit soon!! Thanks for reading

Useful post..Thanks for your effort.

Thanks, today I started with steemit and helped me with your entry a lot

Proff I always learn things, each time you write, keep it up

This post has received a 40.76 % upvote from @aksdwi thanks to: @khaleelkazi.

💙 Great post. Very good writing,i like this post 💙

       🎅 Thanks for Sharing  🎅

open music gif.gif

thanks for the article.

Made mad sense.. Want to see this steemit growing like grass... Hahaha

lol

Not quite markdown but a handy little trick my wife discovered.

Copying cells in excell and pasting them into the markdown view it was automatically converted into a nice crisp image of the table she had made.

Great work. Thank you!

This is so helpful! Thanks! Im always looking up html codes on google.

I am real new and this is very helpful. Thank you.

Thank you! I was looking for this info. I need it so badly! Blessings

Congratulations @khaleelkazi, this post is the ninth most rewarded post (based on pending payouts) in the last 12 hours written by a Superuser account holder (accounts that hold between 1 and 10 Mega Vests). The total number of posts by Superuser account holders during this period was 1203 and the total pending payments to posts in this category was $9201.11. To see the full list of highest paid posts across all accounts categories, click here.

If you do not wish to receive these messages in future, please reply stop to this comment.

lol im tierd of seaching for these cheats you hlped me alot thanx very much and i appreciate you hard work to help peopls <3

Thanks for sharing this
It was really helpful

thanks for sharing....it will definitely help me
upvoted and resteemed

Thanks for this well put together guide. This will be very helpful for newer users.

Quick question. How do you add a photo next to text?

Thanks. What is the code for underlines?

Thanks for sharing this. These tips will just refresh our memory though there might be many articles already on Steemit.

Just read this, and it is so useful! Thank you @khaleelkazi :)