Markdown Tutorial | Make your post more engaging on Hive

Hello my dear friends, how is your Sunday? Following some requests, I decided to use my Sunday to compile the markdowns I know to help you create more professional and engaging posts. Okay, let's get started!


Italic

Type:

*I love Hive*

Result:
I love Hive


Bold

Type:

**I love Hive**

Result:
I love Hive


Strikethrough

Type:

~~I hate Hive~~

Result:
I hate Hive


Heading

Type:

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

Result:

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Link

Type:

Click [here](https://www.hiveblockchain.com/) to learn more about Hive Blockchain 

Result:
Click here to learn more about Hive Blockchain


Image

Type:

![I love Hive](https://cryptologos.cc/logos/hive-blockchain-hive-logo.png?v=013)

Result:
I love Hive


Blockquote

Type:

> I love Hive

Result:

I love Hive


List

Type:

* I love Hive
  * You love Hive
    * We love Hive

Result:

  • I love Hive
    • You love Hive
      • We love Hive

Numbering

Type:

1. One
2. Two
3. Three

Result:

  1. One
  2. Two
  3. Three

Horizontal ruler

Type:

___

Result:


You can use it as a separator to make your post clearer.


Inline code

Type:

`I love Hive`

Result:
I love Hive


Code block

Type:
image.png
Result:

I love Hive
You love Hive
We love Hive

Table

Type:

|column1|column2|column3|
|-|-|-|
|I love Hive|You love Hive|We love Hive|

Result:

column1column2column3
I love HiveYou love HiveWe love Hive

You can increase or decrease the number of columns and rows as you like.
Type:

|column1|column2|
|-|-|
|I love Hive|You love Hive|
|We love Hive|They love Hive|

Result:

column1column2
I love HiveYou love Hive
We love HiveThey love Hive

Align text

Type:

<div class="text-left">I love Hive</div>
<div class="text-center">I love Hive</div>
<div class="text-right">I love Hive</div>

Result:

I love Hive
I love Hive
I love Hive

Note:

  • When typing, the text will be automatically aligned to the left
  • A simpler way to center text
<center>I love Hive</center>

I love Hive


Align anything

You can also use multiple DIV containers to align images, text boxer or anything in the way you want.
Type:

<div class="pull-left">https://files.peakd.com/file/peakd-hive/dodovietnam/23viP5rB27AffYaVCZcbmhcrsSLd4G5XrvmnYxntvPpCULFZndADj8hzVyE7AZ5kCtrbH.png

Result:


Type:

<div class="pull-right">https://files.peakd.com/file/peakd-hive/dodovietnam/23viP5rB27AffYaVCZcbmhcrsSLd4G5XrvmnYxntvPpCULFZndADj8hzVyE7AZ5kCtrbH.png

Result:


Note: To center the content, we use the center tag
Type:

<center>https://files.peakd.com/file/peakd-hive/dodovietnam/23viP5rB27AffYaVCZcbmhcrsSLd4G5XrvmnYxntvPpCULFZndADj8hzVyE7AZ5kCtrbH.png

Result:


On ecency, we have a few more ways to mark up text


Underline

Type:

<ins>I love Hive</ins>

Result:
I love Hive


Text color

Type:

<span class="text-primary">.text-primary</span>
<span class="text-secondary">.text-secondary</span>
<span class="text-success">.text-success</span>
<span class="text-danger">.text-danger</span>
<span class="text-warning">.text-warning</span>
<span class="text-info">.text-info</span>
<span class="text-light bg-dark">.text-light</span>
<span class="text-dark">.text-dark</span>
<span class="text-muted">.text-muted</span>
<span class="text-white bg-dark">.text-white</span>

Result:
.text-primary
.text-secondary
.text-success
.text-danger
.text-warning
.text-info
.text-light
.text-dark
.text-muted
.text-white


Text background color

Type:

<div class="p-3 mb-2 bg-primary text-white">.bg-primary</div>
<div class="p-3 mb-2 bg-secondary text-white">.bg-secondary</div>
<div class="p-3 mb-2 bg-success text-white">.bg-success</div>
<div class="p-3 mb-2 bg-danger text-white">.bg-danger</div>
<div class="p-3 mb-2 bg-warning text-dark">.bg-warning</div>
<div class="p-3 mb-2 bg-info text-white">.bg-info</div>
<div class="p-3 mb-2 bg-light text-dark">.bg-light</div>
<div class="p-3 mb-2 bg-dark text-white">.bg-dark</div>
<div class="p-3 mb-2 bg-white text-dark">.bg-white</div>

Result:

.bg-primary
.bg-secondary
.bg-success
.bg-danger
.bg-warning
.bg-info
.bg-light
.bg-dark
.bg-white

Combination

Okay, these are the basic markdowns I know so far. You can combine them together to create your own way. Hopefully this post will help you in some way to make your journey on Hive more enjoyable.

And to show my gratitude after a while on Hive, I have set up the benefitiaries for this post as follows:

Screenshot_7.png

Thank you very much @trangbaby @jacuzzi and @xuanphuc98 !

Wishing you all a very happy Sunday!

H2
H3
H4
3 columns
2 columns
1 column
23 Comments