The complete beginners guide to formatting on Steemit

in #steemit8 years ago (edited)

Hello Steemians,

I have been learning about how to format posts here on Steemit so thought I would share what I have learned with you all

man-1351317_1280.png

Headers


To create headers in your post you simply need to use the tag <h1>YOUR HEADER HERE</h1>. There are 6 header sizes avaiable, with h1 being the biggest, and h6 being the smallest. See the examples below

Header 1


Header 2


Header 3


Header 4


Header 5

Header 6


Bold, Italics and Blockquotes


To make a text bold enter the following <b>BOLD TEXT<b/> and you will get the following BOLD TEXT.

To make text italics enter the following <i>Italic Text<i/> and you will get the following Italic Text

To make a blockquote enter the following <blockqoute>'TV talent shows make everyone sound like fucking Christina Aguilera' - Dave Grohl</blockquote>, and you will get the following:

'TV talent shows make everyong sound like fucking Christina Aguilera' - Dave Grohl

Aligning text and images


Aligning text


You can align the text and images of your post on Steemit with the following code:

To align your text to the right:
<div class="pull-right">
The quick brown fox jumped over the lazy dog. The quick brown fox jumped over the lazy dog
</div>

To align your text to the left
<div class="pull-left">
The quick brown fox jumped over the lazy dog. The quick brown fox jumped over the lazy dog

You will get the following output:

The quick brown fox jumped over the lazy dog. The quick brown fox jumped over the lazy dog.
The quick brown fox jumped over the lazy dog. The quick brown fox jumped over the lazy dog




Aligning images


You can do the same with images by entering the following code:
<div class="pull-right">
IMAGE SOURCE HERE
</div>
Text here: KFC, formerly know as Kentucky Fried Chicken is an American fast food restaraunt

You will get the following output:

Text here: KFC, formerly know as Kentucky Fried Chicken is an American fast food restaraunt








Breaks in text


To have a gap between text use the <br> code

For example

text
<br>
<br>
text

Will become:
text




text

Adding and captioning images and videos


To add images you can either paste them from the clipboard, drag and drop them here or select them from your device. To add videos from sources such as Youtube, all you need to do is copy and paste the embed code and the video will appear here.

To add a caption to your video or image you need to enter the following <center>YOUR CAPTION HERE</center>, below the image source, and you will get the following:

nibble-3298719_1280.jpg

Who ate all the Nutella?

Creating hyperlinks


Creating hyperlinks is simple in Steemit. To provide a link to my #musicdiscovery 2SBD giveaway I would enter the following:

[Click here to enter my #musicdiscovery 2SBD giveaway] followed by your link in ()

Which would give the following output:

Click here to enter my #musicdiscovery 2SDB giveaway




There are plenty more ways you can further format your blog, which I am going to start looking into and share with you all once I become confident with them.

Thanks for reading, and I hope this has been helpful!

DQmQzFM2sDp5wYpaoktgk9L8RzJCCwPgheNTHo23JUwfAGZ.jpeg

Sort:  


This is a curation bot for TeamNZ. Please join our AUS/NZ community on Discord.
For any inquiries/issues about the bot please contact @cryptonik.

@conradt the timing on this is great, I've been trying to bring my posts up a notch and formatting will help this a lot. great info on the text-align for captions thanks 👍 i best get adding this into my template

No problems @digitaldan glad it was helpful!

To listen to the audio version of this article click on the play image.

Brought to you by @tts. If you find it useful please consider upvote this reply.

Resteemed so I can find it later, thanks for your tips

No problems glad you found it helpful!

Coin Marketplace

STEEM 0.04
TRX 0.33
JST 0.104
BTC 64427.05
ETH 1878.54
USDT 1.00
SBD 0.36