Newcomers Guide || Markdown

01_02_01_main.png

Markdown Code Guide for Beginners

Markdown are very important in making an Atttractive or stylish Post.
So, Everyone should be familiar with its use.
Markdown is a plain text formatting syntax. Writer use Markdowns to quickly write structured content for web. In 2004 Apple expert John Gruber came up with the idea after becoming frustrated by writing long, laborious HTML tags to properly format his content. Using a traditional writing user interface you have to pause your writing every few minutes (or sometimes seconds) and reach for the mouse in order to click, highlight, click a formatting button, and then click back to where you left off in order to continue. Markdown allows you to keep your fingers firmly planted on the keyboard as you apply formatting on the fly.
Following Markdowns usually used in Hive posts.

Headings :

Post content headings are very important since they determine if audiences will read your article or not. We use # hashtag to create headings. Increase in the numbers of # will decrease the size of Heading.
.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Above Headings are created by following codes

# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6

There is another way of creating Headings

  • Heading 1
  • Heading 2
without # . You can add three times equal sign to create Heading 1 and three times little and underneath dashes for Heading 2.

Heading 1

Heading 2

Above Headings are created by following codes

Heading 1
===
Heading 2
---


Bold :

To write in bold style you can use ** on both sides of text.
For example

@ziabutt3836 is your well-wisher

Code for above statement is below.

**@ziabutt3836 is your well-wisher**


Italics :

To write in italics style you can use * on both sides of text.
For example

@ziabutt3836 is your well-wisher

Code for above statement is below.

*@ziabutt3836 is your well-wisher*


Strikethrough :

To write in Strikethrough style you can use ~~ on both sides of text.
For example

@ziabutt3836 is your well-wisher

Code for above statement is below.

~~@ziabutt3836 is your well-wisher~~


Center :

To write in Center align style you can use <center> text here </center>
For example

@ziabutt3836 is your well-wisher

Code for above statement is below.

<center>@ziabutt3836 is your well-wisher</center>


Justify Text :

Unjustified
During writing an essay or a Hive post, justify is nice looking format of writing. For example, this paragraph is not justified that's why it is not attracting the eyes of reader. But when put justify code for this paragraph then it looks nice. Following paragraph is justified.

Justified

This is a justified paragraph that's why it is looking nice. We should use justify style for writing a post on Hive or writing an essay elsewhere. I write justify code below for your guidance. Remember me in your prayers.

Code

<div class="text-justify">This is a justified paragraph that's why it is looking nice. We should use justify style for writing a post on steemit or writing an essay elsewhere. I write justify code below for your guidance. Remember me in your prayers.</div>


List :

You can use * and space to create a list

  • List 1
  • List 2
  • List 3

Code

* List 1
* List 2
* List 3


Alignment of Text into two columns:

If you are from Bangladesh and want to post in Bangla and also translate it into english then you need to align text in two different columns by using following method for your text alignment.

It is Right side of column. Today we try to align our text in two different columns. I think we will be succeed if we follow correctly.
এটি কলামের বাম দিকে। আজ আমরা আমাদের পাঠ্য দুটি ভিন্ন কলামে সারিবদ্ধ করার চেষ্টা করি। আমি মনে করি আমরা যদি সঠিকভাবে নির্দেশাবলী অনুসরণ করি তবে আমরা সফল হব।

.

code

<div class="pull-right">
It is Right side of column. Today we try to align our text in two different columns. I think we will be succeed if we follow correctly.
</div>

<div class="pull-left">
এটি কলামের বাম দিকে। আজ আমরা আমাদের পাঠ্য দুটি ভিন্ন কলামে সারিবদ্ধ করার চেষ্টা করি। আমি মনে করি আমরা যদি সঠিকভাবে নির্দেশাবলী অনুসরণ করি তবে আমরা সফল হব।
</div>


Subscript :

If you want write text or numbers below baseline then You can use <sub> text or number here </sub> code.
C<sub>2</sub>H

Output

C2H .

SuperScript :

If you want to write text or numbers above the baseline then You can use the <sup>text or numbers</sup>command.

3.5×10<sup>23</sup>

Output

3.5×1023

Links :

Often we need to add many links in our steemit post for example our username or any web address or source of any data.

  • When we add a steemit username, along with its @, the name becomes clickable. i.e. @ziabutt3836
  • Link is automatically recognized and is clickable i.e. @ziabutt3836 > > @ziabutt3836
  • We can hide a link in a word or phrase, using the below syntax
    [Zia profile](https://hive.blog/@ziabutt3836) Output Zia profile

Table :

If you want to insert a table in your post you should follow following format and add as many Headers and Cells you need.

Header 1 | Header 2
--------- | ----------
Cell 1 | Cell 2

Output

Header 1Header 2
Cell 1Cell 2

Quotes :

If you want to write a statement which is not yours or a Quote or phrase that someone said. Use > before statement.

> "Knowledge is power.”
― Sir Francis Bacon

Output

"Knowledge is power.”
― Sir Francis Bacon


Images Alignment :

Image Left Align :

This Image is Left Align and the text is Right Align. Code for this action is written below. You can change image and text according to your requirement but the command will remain same.

.

Code
.
Code
<div class="pull-left">
https://images.ecency.com/DQmbTPHg6VaD8FnYJZ9Cf9Zp97CCxsJcn4sKaqKcwfuJjxP/profile_pic.jpg
</div>

Image Left Align :

This Image is Right Align and the text is Left Align. Code for this action is written below. You can change image and text according to your requirement but the command will remain same.

.

Code

<div class="pull-right">
https://images.ecency.com/DQmbTPHg6VaD8FnYJZ9Cf9Zp97CCxsJcn4sKaqKcwfuJjxP/profile_pic.jpg
</div>

Image Center Align :

This Image is Center Align and the text is also Center Align. Code for this action is written below. You can change image and text according to your requirement but the command will remain same.

Code

<center>https://images.ecency.com/DQmbTPHg6VaD8FnYJZ9Cf9Zp97CCxsJcn4sKaqKcwfuJjxP/profile_pic.jpg</center>

Gifs :

Code

<center>https://blog.commlabindia.com/wp-content/uploads/2019/07/animated-gifs-corporate-training.gif</center>

Videos :

You only copy and paste the youtube video URL in your post to add a video in your post.
Or upload your video on steemit.

Code for above video

https://m.youtube.com/watch?v=vcXzXMV4go0


11.jpg


I try my best to describe my whole knowledge Markdown Code, I apologize in advance if I made any mistake or violate any Community rule.


Special thanks goes to @prayzz for his Guidance and @lazy-panda for his support.

Thanks 🌹 for your time to read my post. If you love my post, feel free to comment and also support me, it will help to get me motivated. Remain bless as you read through this post. Thanks

H2
H3
H4
3 columns
2 columns
1 column
Join the conversation now
Ecency