30 July 2015

Blogger Hacks: Basic Formatting html Tags


When composing a post, you may have noticed that in the top left hand corner, there are two post writing modes that you can switch between; Compose and HTML. While there is nothing wrong with only using the Compose section, you will have far more control over the layout and design of your post by using the HTML section. This will become more apparent in the future when I got into elements that you can add to these basic tags.

GREEN - Where you need to enter your own information

Formatting HTML

Headings
The font styles and colours of your headings are determined by your template, but fear not if you don't like your presets! With some basic CSS, you can customize to your hearts content by using the Blogger Template Designer > Advanced > Add CSS. I will be going through this next week. 

Please Note: What your Heading styles look like depends on the template you are using for your blog. The ones seen here are the presets I have hard-coded into my template.
H1
<h1>Heading 1</h1>

Heading 1

H2 (Heading / Widget Titles)
<h2>Heading 2</h2>

Heading 2

H3 (Subheading / Post Titles)
<h3>Heading 3</h3>

Heading 3

H4 (Minor Heading)
<h4>Heading 4</h4>

Heading 4

H5
<h5>Heading 5</h5>
Heading 5
H6
<h6>Heading 6</h6>
Heading 6


Font Type

Bold Type Face
<b>Bold Text</b> Bold Text
<strong>Strong Text</strong> Strong Text
Italics Type Face
<i>Italic Text</i> Italics Text
Underline Type Face
<u>Underline Text</u> Underline Text
Strike Through Type Face
<strike>Strike Through Text</strike> Strike Through Text


Text Alignment

Left
<div style="text-align: left;">
Left Align</div>
Left Align
Centre
<center>
Centre Align</center>
Centre Align
<div style="text-align: center;">
Centre Align</div>
Centre Align
Right
<div style="text-align: right;">
Right Align</div>
Right Align
Justified
<div style="text-align: justified;">
Justified Align</div>
Justified Align


Images
Images are great, because when readers only see a big block of text, it kind of intimidates them and puts them off. Images are also good to go in your sidebar to promote things that are happening on your blog.

Please Note: For demonstration purposes, I have used the IMAGE_URL for the thumbnail of my blog button.
<img src="IMAGE_URL" width="SIZE" />


Links
Knowing how to use hyperlinks is a simple way to make your blog look that little bit more professional - nobody likes seeing just a random URL in the middle of the text you're reading, it just ruins the flow. It is especially handy if you are participating in memes and are leaving links to your post on other blogs.

Please Note: For demonstration purposes, I have used the URL for this post, my EMAIL, and the IMAGE_URL for the thumbnail of my blog button.
Hyperlink
<a href="URL" target="_blank">
Hyperlink</a>
Hyperlink
Email Link
<a href="mailto:EMAIL" target="_blank">
Email Link</a>
Email Link
Image Link
<a href="URL" target="_blank">
<img scr="IMAGE_URL" width="SIZE" /></a>


Line Break
This function defines a single line break. Depending on how you have your Options (RHS Post Settings post composing sidebar) set up for line breaks, you may not need to worry about using this (ie. if you've selected 'Press "Enter" for line breaks'). However, the function is useful if you're setting up a Post Template.
Segment_1<br/>Segment_2 Segment_1
Segment_2


Thematic Change
This function is good for defining sections in your blog posts. The best part about this function is that it automatic fits to the width of your text space width!
<hr/>


Blockquote
For book blogs, I feel that the blockquote function is the most useful one you can use. It's great for, as the function suggests, quotes, but also for book synopsis and author bios as it indents to use 80% of your text space width.
<blockquote>
Blockquote Text</blockquote>
Blockquote Text


Button
Everybody loves clicking on buttons - well at least I do. This basic button is a great starting point, and if you add a link to it, even better!
<button>
Button Text</button>
<a href="URL" target="_blank"><button>
Link Button Text</button></a>


Lists
Lists are great! They get information across clearly and quickly. And the best part? It means that you don't have to write as much to get the same information across - which leaves more time for reading!
Ordered List (Numbered)
<ol>
<li>List Item 1</li>
<li>List Item 2</li>
</ol>
  1. List Item 1
  2. List Item 2
Unordered List (Dots)
<ul>
<li>List Item 1</li>
<li>List Item 2</li>
</ul>
  • List Item 1
  • List Item 2


Helpful Links


No comments :

Post a Comment

Thanks for stopping by and leaving your thoughts!

Happy Blogging,
Renae

Labels

Adult ( 42 ) Adventure ( 1 ) Ally Carter ( 5 ) Amanda Hocking ( 7 ) Andrea Cremer ( 1 ) Angels ( 11 ) Aprilynne Pike ( 1 ) ARC ( 38 ) Aussie Author ( 19 ) Author Love ( 4 ) Battle of the Nations ( 9 ) Blog Tour ( 88 ) Blogger Hacks ( 3 ) Blogoversary ( 2 ) Book Blitz ( 156 ) Book Love ( 5 ) Book Spotlight ( 7 ) Book Swag ( 1 ) Book Trailer ( 13 ) Book Twins ( 1 ) Books ( 84 ) Character Interview ( 3 ) Comedy ( 15 ) Contemporary ( 170 ) Contemporary Sports Romance ( 4 ) Countdown ( 1 ) Cover Crazy ( 9 ) Cover Reveal ( 129 ) Cynthia Hand ( 2 ) Debut ( 2 ) Dusty Reads ( 5 ) Dystopia ( 12 ) Dystopian ( 27 ) Excerpt ( 131 ) Faeries ( 12 ) Fairy Tales ( 1 ) Fairy Tales Retold ( 2 ) Fantasy ( 17 ) Feedback ( 1 ) Friday Finds ( 5 ) Gena Showalter ( 1 ) Give-away ( 259 ) Griffin Hayes ( 4 ) Guest Post ( 18 ) Hachette Australia ( 1 ) Historical ( 4 ) HOP ( 28 ) Horror ( 3 ) IMM ( 11 ) Inside the Author's Head ( 2 ) Interview ( 23 ) LGBTQ+ ( 4 ) M/M ( 1 ) Magic ( 5 ) Maria V. Snyder ( 9 ) Meg Cabot ( 1 ) Miranda Kenneally ( 4 ) Movies ( 2 ) Musings ( 45 ) My Life ( 3 ) Mystery ( 3 ) Mythology ( 1 ) NetGalley ( 6 ) New Adult ( 154 ) New Adult College Romance ( 1 ) Paranormal ( 52 ) Paranormal Romance ( 16 ) Playlist ( 2 ) Pledged ( 6 ) Post-Apocalyptic ( 19 ) Prequel ( 1 ) PROMO ( 18 ) PROMO Blitz ( 1 ) Quiz ( 1 ) Reading Challenges ( 2 ) Review ( 103 ) Review Request ( 20 ) Romance ( 184 ) Romance. ( 1 ) Romantic Suspense ( 1 ) Sci-fi ( 2 ) Science Fiction ( 10 ) Short Story ( 4 ) Special Content ( 2 ) Sport ( 4 ) Sports ( 14 ) Stacking the Shelves ( 14 ) Starr Ambrose ( 1 ) Supernatural ( 1 ) Survey ( 1 ) Suspense ( 9 ) Teaser ( 28 ) Teaser Tuesday ( 15 ) Thriller ( 4 ) Time-Travel ( 1 ) Top 10 ( 2 ) TV ( 2 ) Update ( 1 ) Urban Fantasy ( 3 ) Vampires ( 5 ) Waiting on Wednesday ( 51 ) Welcome ( 1 ) Werewolves ( 5 ) Writing ( 1 ) Young Adult ( 96 ) YouTube ( 3 ) Zombies ( 9 )