How to Use Mark Down Style for an Appealing – Easy to Read Post in Steemit.
steemithelp·@katerinaramm·
0.000 HBDHow to Use Mark Down Style for an Appealing – Easy to Read Post in Steemit.
A post needs to be nicely formatted to be able to be read easily. Steemit supports [Markdown]( https://guides.github.com/features/mastering-markdown/) and you can achieve an attractive result, by using basic syntax & easy to remember commands. <div class="pull-left">https://steemitimages.com/DQmYsoFQqvzY1Y7cvL14MtTqsKLRrZyVBzvd5fXNRPThYqS/markdown.jpg</div> <br>There are also tools that you can use as editors, if you use one of them please comment below. I personally prefer to use raw html syntax (for some reason I find it easier) <br>In the next days I will post tips about formatting a post, my part three from ‘[What to Post]( https://steemit.com/steemit/@katerinaramm/deciding-what-to-write-about-researching-synthesis-of-a-blog-post-a-personal-approach-by-katerinaramm-part-1-what-to-post), [How to Research](https://steemit.com/steemit/@katerinaramm/deciding-what-to-write-about-researching-synthesis-of-a-blog-post-a-personal-approach-by-katerinaramm-part-2-researching), **Synthesis of a Blog Spot**), so I thought I should also include in advance a mark down guide with the most important commands I have been using for you that might not know them all. ## <center>Ξεκινάμε! Los geht’s! Let’s start! </center> # *Click On `Post`* <div class="pull-right">https://steemitimages.com/DQmXhu2fo6n6WZkjSH76AUwQWTuTAg62afecPME32GYYoiF/editor.jpg</div> # *You have the option to click the ‘Editor’ or leave as is ‘Raw Html’ In the below section we will show commands to be directly written in the post box (NO EDITOR)* --- # <center>TEXT Commands</center> ## <center>Headlines </center> You can put `#` on the left of your word/sentence to make it a headline. As the `#` number is increasing, the headline size decreases. ---- `# Headline 1` # Headline 1 . . ----- `#### Headline 4` #### Headline 4 . . `###### Headline 6` ###### Headline 6 --- ## <center>Text</center> Your text can be simple, `**bold**` **bold**, `*italics*`*italics*, `~~strikethrough~~` ~~strikethrough~~ ## <center>List </center> You can use `*`or `numbers` to create a list * list item 1 * list item 2 1. Item A 2. Item B ## <center>You can create a table!</center> `Header 1`| `|` `Header 2` `----------` `|` `----------` `Cell 1` `|` `Cell 2` Header 1 | Header 2 ---------- | ---------- Cell 1 | Cell 2 --- ## <center>Justify Text </center> `<div class="text-justify">` `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc eget purus a tortor egestas placerat sit amet vitae sem. Nullam sit amet finibus justo. Donec volutpat ipsum leo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse sit amet dignissim ante. ` `</div>` - The Output will be - <div class="text-justify"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc eget purus a tortor egestas placerat sit amet vitae sem. Nullam sit amet finibus justo. Donec volutpat ipsum leo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse sit amet dignissim ante. </div> <br> - Instead of <br>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc eget purus a tortor egestas placerat sit amet vitae sem. Nullam sit amet finibus justo. Donec volutpat ipsum leo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse sit amet dignissim ante. ## <center>Allign text into two cells </center> Sometimes you may need to write something in two languages or input it in two different columns. <br> `<div class="pull-right">` `TEXT RIGHT Cras pellentesque, diam ut fringilla luctus, massa mauris fringilla magna, sed consequat mi odio in ante. Etiam quis odio in ante sagittis congue. Duis a ante egestas, pharetra nisl non, lacinia massa. Vestibulum ut mattis enim. Nam scelerisque iaculis sem in lacinia. Phasellus dui dui, pellentesque ac dui ac, rhoncus tempor tellus.` `</div>` `TEXT LEFT Cras pellentesque, diam ut fringilla luctus, massa mauris fringilla magna, sed consequat mi odio in ante. Etiam quis odio in ante sagittis congue. Duis a ante egestas, pharetra nisl non, lacinia massa. Vestibulum ut mattis enim. Nam scelerisque iaculis sem in lacinia. Phasellus dui dui, pellentesque ac dui ac, rhoncus tempor tellus.` --- <div class="pull-right"> TEXT RIGHT Cras pellentesque, diam ut fringilla luctus, massa mauris fringilla magna, sed consequat mi odio in ante. Etiam quis odio in ante sagittis congue. Duis a ante egestas, pharetra nisl non, lacinia massa. Vestibulum ut mattis enim. Nam scelerisque iaculis sem in lacinia. Phasellus dui dui, pellentesque ac dui ac, rhoncus tempor tellus. </div> TEXT LEFT Cras pellentesque, diam ut fringilla luctus, massa mauris fringilla magna, sed consequat mi odio in ante. Etiam quis odio in ante sagittis congue. Duis a ante egestas, pharetra nisl non, lacinia massa. Vestibulum ut mattis enim. Nam scelerisque iaculis sem in lacinia. Phasellus dui dui, pellentesque ac dui ac, rhoncus tempor tellus. ## <center>You put your text in the center</center> `<center>Text</center>` <center>Text</center> ## <center>Subscript Text</center> `<sub>Text</sub>` <sub> Text </sub> ## <center>Add a Link</center> If you add any link, it will immediately be clickable but if you wish to add a link to a word you can use the below syntax `[Link Title](Link)` `[I am a Link](https://steemit.com/@katerinaramm)` [I am a Link](https://steemit.com/@katerinaramm) ## <center> Blockquotes with > for something that someone has written/said</center> `> I am a quote by someone famous` > I am a quote by someone famous ## <center>Separate your themes - paragraphs with an easy-to-make rule</center> If you use three or more hyphens, asteriscs, or underscores a horizontal rule will be created `--- or *** or ___` ---- ## <center>Adding Code (text in a grey area with possibility of having commands not affecting the text inside)</center> You can check [here](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet#code) And I have found it to work in two ways: a. Adding two [back-ticks](https://apple.stackexchange.com/questions/69820/typing-a-backtick-on-mac-os-x-snow-leopard) before and after the markdown syntax `**this is a bold word**` - output - **this is a bold word** or b. you can use `<code>` before and after the command `</code>`at the end of the word/sentence `<code> > goodmorning </code>` output will be >>>>>> > goodmorning ---- # <center>Images</center> In order to add an image all you got to do is (a) have the image :) and (b) drag and drop it in the editor You can put the image in the center by putting the `<center>Image</center>` or you can put it inline with text, on the right or left The order for left is as follows **Attention, you take only the last part of the image > see below** `<div class="pull-left">` `https://steemitimages.com/DQmSCQFPwCSaHawE7fgQtKpidX9yE4tnmjJ5U1P9DamK58M/bb2.jpg` `</div>` `text below` <div class="pull-left"> https://steemitimages.com/DQmSCQFPwCSaHawE7fgQtKpidX9yE4tnmjJ5U1P9DamK58M/bb2.jpg </div> Cras pellentesque, diam ut fringilla luctus, massa mauris fringilla magna, sed consequat mi odio in ante. Etiam quis odio in ante sagittis congue. Duis a ante egestas, pharetra nisl non, lacinia massa. Vestibulum ut mattis enim. Nam scelerisque iaculis sem in lacinia. Phasellus dui dui, pellentesque ac dui ac, rhoncus tempor tellus. `If you would like the image to be alligned to the right simply replace left with right` ## <center>You may also put links to images and align them next to each other - use it in text or in your signature</center> <br> `<center>[](https://steemit.com/@katerinaramm) [](https://twitter.com/katerinaramm1) [](https://www.facebook.com/KaterinaRamm-876468415833984/) [](https://www.instagram.com/katerinaramm1/)</center>` <center>Output</center> <center>[](https://steemit.com/@katerinaramm) [](https://twitter.com/katerinaramm1) [](https://www.facebook.com/KaterinaRamm-876468415833984/) [](https://www.instagram.com/katerinaramm1/)</center> # <center>Insert Gifs</center> You just copy paste the gif's address as below. You may even put the gif in the center, or justify with the `<div class="pull-left">GIF</div>`command `<center>https://media.giphy.com/media/tQcR4ZFWypsA0/giphy.gif</center>` <center>https://media.giphy.com/media/tQcR4ZFWypsA0/giphy.gif</center> # <center>YouTube or DTube Videos</center> You can simply copy paste the DTube or YouTube Link and it will be embedded in the text! https://www.youtube.com/watch?v=N7sW8KikiqM More Links for Markdown [Guide github.com](https://guides.github.com/features/mastering-markdown/) [Markdown Cheatsheet](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet) [Emoticons You may use](https://www.webpagefx.com/tools/emoji-cheat-sheet/)  <center>Thank You for visiting! Please comment below and feel free to ask or add if something is useful for you and left out from my side so that I can add it!</center>
👍 annadeda, onart, evimeria, greek-trail, shimster, papadimos, hr1, trumpman, upvoteforfree, alexanderfluke, giosou, greeksteemjesus, alexander.alexis, evagreca, onceuponatime, erath, marginal, indominon, vault, friend5, twiceuponatime, tkappa, ravindra09, alinak15, lordneroo, ruth-girl, nikoleondas, grace44, artgalleryraka, thatanimesnob, aumsong, iliasdiamantis, raefbelguith, koskl, beveryting, holidaygreece, eric-boucher, rebeccaryan, masscollective, samuelmorayo, followforupvotes, dexterdev, nikosnitza, skapaneas, mariossap, leesim, eliakon, musicoplanetario, creepyturtle, rouketas, karinxxl, bubke, warrkin, emmamia, macesen, andrianmaulana61, irmeyhamidi, anarchojeweler, avtzis.petros, filotasriza3, shreek77, newsbreaker, sift666,