How to HTML

Your wait is finally over, it is Wednesday and time for another blogging tip from yours truly! Couple of weeks ago I gave you the "How to Format Your Blog" tip and promised you all a crash course in HTML or HyperText Markup Language. If you are just not getting the formatting of your blog right and wish you can click on ‘Source‘ and edit it yourself, here are some basic tips (keep in mind I am no web teacher):

• How to start a new paragraph:

  The html code for a paragraph is <p> how easy is that. So for whatever text you have put <p> at the beginning and end it with a </p>. And do the same with the next paragraph and so on. Paragraphs will make your blogs easier to read and not as jarring as a big ol’ lump of words.

• How to add an image:

  If you are not a fan of our fun html editor and would like to enter an image the good old fashioned way, here is the code. <img src="image link"> and thats it. The src tells where to get that picture. So for example my image (which I uploaded to my Photobucket – see my How to Add Images to Your Blog post) is at this link http://i297.photobucket.com/albums/mm240/intentblog/56853856_e261752dce_m.jpg so my code will be <img src="http://i297.photobucket.com/albums/mm240/intentblog/56853856_e261752dce_m.jpg"> and thats it. You pop that in and get:

  
  Photo by chotda

• How to Bold, Italicize and Underline:

  If you want to emphasize any part of your article use these 3. To make someting bold just add a <b> before it and </b> after it. <b>Cupcake</b> = Cupcake. To Italicize something just add a <i> before and </i> after. <i>Raspberry</i> = Raspberry. To underline something it is a <u> before and a </u> after. <u>Yummy</u> = Yummy.

• How to add bullets:

  Our numbers are still on a vacation, but you can add bullets. Bullets are an unordered list, so you start it with a <ul> and then enter all the bullets in between <li> and </li>. So <ul><li>Pink</li><li>Purple</li><li>Blue</li> will look like this:

  • Pink
  • Purple
  • Blue
• How to add a link:

  The links are definted with the <a> tag. Once you have your URL (the web address for example http://www.intent.com/podcasts) you will enter it like this: start with <a href=""> and enter your URL in between those quotes. So the first part will be <a href="URL"> After that tag you will enter whatever it is that you want to link. If you want add a link to the word Butterfly this is what the code will look like. <a href="URL>Butterfly</a> and voila whoever clicks on Butterfly will go to your link. If you want to link an image, you put the <img>tag there instead of  Butterfly (so basically <a href="URL"><img src="IMAGE"></a>). Example: Listen to our <a href="http://www.intent.com/podcasts">Podcasts</a> – this gives you = Listen to our Podcasts.

• How to resize and align an image:

  You want to add an image to your blog but you dont want it to be big and sit by it’s lonely self. You can add a couple more words to the image code. These words are – width, height and align. Width and height are pixel numbers and align will be right, left or center. So for example – <img src="http://i297.photobucket.com/albums/mm240/intentblog/56853856_e261752dce_m.jpg" height="75" align="right> will give you this:

  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras rutrum pretium est. Duis in sapien. Nunc bibendum, mauris id rutrum varius, orci diam cursus lacus, id sodales justo massa at orci. Donec ligula. In hac habitasse platea dictumst. Curabitur posuere lectus a tortor. Donec lobortis mattis dui. Donec tempus metus porttitor ligula. Aliquam tempus, metus id aliquet egestas, purus ipsum venenatis enim, sed ultrices lectus lorem in eros.

• How to change fonts and colors:

  Sick of the boring black. Try some fonts and colors. To add a color you will use the <font> tag. So if I want the word Red Velvet to be red I’ll use this code: <font color="red">Red Velvet</font> and this gives me Red Velvet and if you don’t that particular red you can even input the html color code. So If I want a pinker and deeper red I’ll use <font color="990033">Red Velvet</font> and that gives me: Red Velvet . Thats much better! Now If I want a nicer font, <font face="Georgia">Red Velvet</font> gives me Red Velvet. Make sure you pick general fonts like Comic Sans Verdana Trebuchet MS Times New Roman that are in everybodys libraries. Font size is <font size="3">size matters</font> – size matters.

I hope that will help you all. I’m html-ed out for now and will bring you more tips next Wednesday. If you have something you want me to cover or a question, please leave it in the comments section.

xoxo, Eden