Adding HTML to your WordPress blog.

Adding HTML to your WordPress blog. This is a simple explanation of what HTML is and how to add it to your WordPress Site.

 
HTML stands for Hyper Text Markup Language, and is a popular language for building websites in. With WordPress much of the HTML is automated, but you, even as a beginner can add HTML easily, straight to the page.

The easiest way to understand HTML is to think of it as ON/OFF switches where <?> is On and </?> is Off.

When you are editing your WordPress Blog there are two options, most people will edit in Visual mode, this is because the HTML is automatically created for you, but sometimes you want to tweak thing a little bit and the visual editor doesn’t cover all eventualities.

An example of this might be if you want to edit a part of a sentence, but when you select the word or part of the sentence, the styling you do is applied to the whole sentence.

Using the HTML editor on word press and the rules listed below, you can quickly and easily add simple HTML to any part of a page you want.

My suggestion for absolute novices is to print this out and keep it by your computer, then continue to edit your blog in visual mode, save your work and then have a look at the HTML version of you post and compare the layout on the page to the explanation below

Bold
To bold text place a <b> in front of the text you want bolded and a </b> when you want the bolding to end.

Italics
You use italics just like bold. Put a <i> before the text you want italicized and a </i> when you want the italics to end.

Underline
Just like bold and italics, place a <u> before the text you want underlined and a </u> after.

Strikethrough
I’m sure you get the idea by now. Put a <s> before and a </s> after.

Font Color
Changing font color is almost the same. Place a <font color=X> before the text you want changed and a </font> after. X is the color you want the text changed to. You can use the words red, blue, orange, yellow, purple, green, or black, or you can use hex codes. Don’t worry, it’s easier than it sounds. Go to HTML Goodies for a list of 104 different colors. Instead of using the color name as X you use the hex code.

For example: <font color=00FF00>This is lime.</font> gives you:This is lime.

Font Size
<font size=X> before and </font> after.

X can be a number 1-12. One is the smallest and 12 is the largest. In the forums you probably shouldn’t go past 4. The font color and font size codes can be used together.
<font size=4 color=blue>Big Blue</font>Big Blue

Font Face
<font face=”X”> X can be serif, sans-serif, cursive, fantasy, or monospace. The font face can be used in combination with the other font codes like this:
<font face=”cursive” color=red size=5>Cursive Big Red</font>Cursive Big Red

Subscript and Superscript
For subscript use <sub> and </sub>.

For superscript use <sup> and </sup>.
Centering Text

To center text use <center> and </center>.
Paragraphs and line breaks

To make a paragraph use <p>. The </p>. is optional at the end of each paragraph. The <p> code by itself ends the current line and inserts a blank line. To end the current line without inserting a blank line, use <br> (No ‘Off’ switch is needed). An option for a line break is the No Break Space which is inserted between lines in the HTML editing mode like this. &nbsp;

Indenting
To indent use <dd> no ‘Off’ switch is needed.

Block Quotes
To put text into a block quote form use <blockquote> and </blockquote>.

Hyperlinks
This one is very similar to the font commands. <a href=”The URL of the Site”>A Label For the Hyperlink</a>. The quotation marks are required. The hyperlink code for Yahoo! looks like this: <a href=”http://www.yahoo.com”>Yahoo!</a>.

E-Mail links from your page
This is what’s known as a mailto: command. It follows the same coding scheme as the hypertext link above. What this format does is place blue wording on the screen that people can click to send you an e-mail.

Here’s the pattern: <A HREF=”mailto:jburns@htmlgoodies.com”>Click Here To Write Me</A>

Notice that it’s the same format as a link except in this link you write “mailto:” in place of thehttp:// and you place your e-mail address in place of the page address/URL. Yes, you still need the </A> tag at the end. Please notice there is NO SPACE between the colon and the e-mail address.

Images
<img src=”The URL of the Image”> The quotes are required but no “Off” switch is needed.

!!Forum and Internet Etiquette!!
* Try not to use images in your posts with the exception of your sig.

* Don’t link to an image on someone else’s web site without their permission, this is called Hotlinking. It often costs the website owner money each time the picture is viewed. A savvy webmaster may attach an offensive image to the link causing you a lot of grief in doing so.

Bulleted Lists
* For
* a
* bulleted
* list
put a <ul> at the beginning of the list. For each line of the list put a <li> at the beginning and a </li> at the end. At the end of the list use a </ul>

Hope you enjoy this post and use it successfully.

 

 

Weybridge, Cobham, Cranleigh, Heathfield, Worthing, Esher, Oxshott, Horley, Burgess Hill, Lancing, Chessington, Epsom, Crawley, Henfield, Shoreham, Ewell, Banstead, East Grinstead, Hassocks, Portslade, Sutton, Coulsdon, Tunbridge, Tunbridge Wells, Hailsham, Hove, Wallington, Caterham, Lewes, Brighton, Purley, Horsham, Rottingdean, New Addington, Biggin Hill, Crowborough, Leatherhead, Southwater, Storrington, Peacehaven, Warnam, Warlingham, Dorking, Newhaven, Eden bridge, Reigate, Cuckfield, Seaford, Edenbridge, Redhill, Haywards Heath, Eastbourne, Oxted, Ockley, Uckfield, Turners Hill, Crawley Down.