Steemit: Design Your Posts Using Basic HTML Coding for BeginnerssteemCreated with Sketch.

in #steemit7 years ago

Steemit: Design Your Posts Using Basic HTML Coding for Beginners

As more members join Steemit's amazing community the question continues to pop up on many social media sites'. That question, how do I design my posts on Steemit? The answer is fairly simple if you are familiar with coding but, if you have never done even the basic coding before it will be a bit intimidating. This post will clearly demonstrate the basic HTML coding for Beginners and set a foundation for you to design your posts on steemit. Don't worry even a beginner will be able to use this because it really is easy.

,.png

HTML For Beginners

Every code has an opening and an ending, similar to sentences. An opening sentence has a capital letter and the end has a period or exclamation mark. The difference with coding is that your opening will look similar to this: <> </>. The first bracket will hold your commanding code while the end will hold a forward slash with the same code. That forward slash CLOSES the code, it is VERY IMPORTANT you have that on every code.

You can combine codes in one sentence HOWEVER every code requires its very own bracket. For example: I can Bold and Italic the same words but the bold requires its own code as well as the italic.

Common HTML Codes for Beginners

For these examples to show there are spaces between the code inside the bracket, DO NOT add these spaces to the code.

Header 1

< h 1> < /h 1>

Header 2

< h 2> < / h 2 >

Header 3

< h 3 > </ h 3 >

Header 4

< h 4 > </ h 4 >
Header 5
< h 5 > </ h 5 >
Header 6
< h 6 > </ h 6 >

Paragraph text < p > < / p> this code is not necessarily needed on steemit but, it can come in handy with almost anything you do.

Bold Text < b > </ b >

Italic Text < i > < / i >

Center Align Text < center > < / center>

Text Link to Another Post or Website < a href = "url" > Link Name < /a >

Divide Page Content < div> < / div >

Force a Page Break
this is the one code that does not get a closing code.

Text Formatting Codes More Advanced

Underline Text < u > </ u >

Strikeout Text < strike > < / strike >

Small fine print text < small > < / small >

Typewriter Text < tt > < / tt >

Preformatted Text < pre > < / pre >

Text Block Quote < blockquote > < / blockquote >

Designing Your Posts on Steemit Can be Fun With the Right Help and Coding

Design Your Posts on Steemit

Now you can start designing your posts more easily with a little flare to be unique. Be creative, design, and have fun with html coding. Feel free to let me know if I missed any in the comments. Thanks for reading!

Upvote Upvote Resteem Follow Upvote Upvote

Follow @AshleyOnline for more Awesome Posts

Sort:  

Thanks for this!! I'm new to Steemit and to coding in general, and this is really helpful to have. Cheers!

You are very welcome! I was there too, once before. I taught myself coding years ago but, never realized I would need it as much as I do these days. Steemit is easy to design, don't worry it will be fun.

You are very welcome. Happy to help!