Friday, October 2, 2009

A Coder's Approach to Blogger, creating posts using html

The blogger’s editor is worse! Either it will mess the codes or the output. Never gives me the desired result. Understanding the code really helped me. Below I mention every type of formatting and a sample code to use for that. If you paste those codes on blogger [html edit option] you will see in the preview how nice it works.

Simple Title
<div style="text-align: center;">
<span style="line-height: 15px; white-space: normal;">
<span style="font-size: x-large;"><span style="color: #783f04;">
<span style="font-family: Arial, Helvetica, sans-serif;">
This is the title to be shown
</span></span></span></span>
</div>

A Standard Title that I like
<div style="text-align: center;">
<span style="font-family: Arial, Helvetica, sans-serif;">
<span style="font-size: x-large;">
<span style="color: #b45f06;"> // We can set color as we wish
Standard Title to be Shown
</span></span></span></div>

Normal Text
<div style="text-align: justify;"> // Justify the text
<span style="line-height: 15px; white-space: normal;">
// White spaces visible
<span style="font-family: Verdana, sans-serif;">
// Set font verdana
<span style="font-size: small;"> // Set small font
Making Money Online: A True Approach
</span></span></span>
</div>

Inserting an image
<div class="separator" style="clear: both; text-align: center;">
<a href="http://bux.to/images/top.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;">
<img border="0" src="http://bux.to/images/top.png" /></a>
</div>

My Own Numbering
<span style="font-size: x-large;"> // I’m trying a large one
<span style="color: #990000;">
<span style="font-family: Verdana, sans-serif;">
1 // use any symbol you want
</span></span></span>

Hyperlink Text Segment
It’s as easy as it is in html.
<a href="https://www.alertpay.com/">
<span style="font-family: Verdana, sans-serif;"> // set font
Text to show</span></a>

Beautified Tabbed Links
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">
<span style="font-size: 12px; line-height: 15px; white-space: pre-wrap;">
// To accept space and newlines
<a href="http://ptc-investgations.blogspot.com/2009/04/buxto-confirmed-scammer.html">
http://ptc-investgations.blogspot.com/2009/04/buxto-confirmed-scammer.html
</a></span></span>

Bold
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">
<span style="font-size: 12px; line-height: 15px; white-space: pre-wrap;">
<b>Bold Statement</b>
</span></span>

Tips and Tricks
Justify texts
<div style="text-align: justify;"></div>
New paragraph
<div>Para here</div>
Alternative to new lines:
<span style="font-size: small;"></span>

Office Equivalent Title
<div style="text-align: left;">
<span style="line-height: 15px; white-space: pre-wrap;">
<span style="font-size: x-large;">
<span style="color: #4F81BD;">
<span style="font-family: Cambria, sans-serif;">
This is the title to be shown
</span></span></span></span> </div>

Programming Language Codes In html
Only care should be taken for < and > signs. "<" should be noted by &gt; and ">" should be noted by &lt;
Outside of code tags, you may need to use entities for some characters:
For: Use:
& &amp
< &lt;
> &gt;
[ &#91;
] &#93;

1 comment:

  1. If you need to know details please leave comments here. I'll update.

    ReplyDelete