Sunday, September 26, 2004
Blogging 102: HTML Code
Okay class, today we're going to learn about some simple HTML tags you can use in your new blog. You may remember that we've already gone over how to start a blog. Now, with a little bit of HTML code in your arsenal, you can do really cool stuff!
There are plenty of HTML tutorials out there, and you can read them. I'm not going to cover them all (like a bullet or numbered list, etc). But for a blog, you only need a few of them. For all HTML tags, you have to put a < first, then the code to do something, then another >. That is called a tag. You put one of these before you want to do something, then a <, /, the code again, then > to close it. Confused? Don't be. Let me show you.
To make something bold, you type <_b_>, then the words you want bold, then <_/_b_>. However, take all the underlines out. I have to put them in so that you can see the tags! So you see how it works? Pretty simple. Here's some of the main ones you'd want to know:
<_b_>Bold<_/_b_>
<_i_>Italics<_/_i_>
<_blockquote_>
Now to make a link (you probably don't need this for blogger, but here it is anyway), it's a little bit different. The code is: <_a href="http://www.domain.com"_>. However, there is a space between the a and the href. Type out the words you want linked, then close it with <_/_a_>.
To add an image that is already online, you have to first get the image's URL. To find it, right-click on an image you like and look at it's properties. You'll see the URL there. Copy it then come back to your blog. To insert the image, the code is: <_img src="http://www.domain.com/image.jpg"_>. This code you don't have to close with a slash tag , / >, but there is a space in-between the img and src. However, you can add some cool stuff to the image tag to make it do stuff. These instructions go after the image's URL and " mark, but before the >. If you want the image to align to the left or right (like in Word or something), type align=left. If you want a buffer around the image, type hspace=5 or whatever number you want. That number is the number of pixels the buffer will be. You can also resize an image by typing width=200 or height=200, the number being the measurement in pixels.
So, here's an example of how an image tag would look: <_img src="http://www.domain.com/image.jpg" align=left hspace=10 width=200_>.
That's it! Now, what if that image isn't online? Oh, we'll cover that in the Blogging 201 class. See you next time!
There are plenty of HTML tutorials out there, and you can read them. I'm not going to cover them all (like a bullet or numbered list, etc). But for a blog, you only need a few of them. For all HTML tags, you have to put a < first, then the code to do something, then another >. That is called a tag. You put one of these before you want to do something, then a <, /, the code again, then > to close it. Confused? Don't be. Let me show you.
To make something bold, you type <_b_>, then the words you want bold, then <_/_b_>. However, take all the underlines out. I have to put them in so that you can see the tags! So you see how it works? Pretty simple. Here's some of the main ones you'd want to know:
<_b_>Bold<_/_b_>
<_i_>Italics<_/_i_>
<_blockquote_>
Use blockquote when you're doing a long quote<_/_blockquote_>
Now to make a link (you probably don't need this for blogger, but here it is anyway), it's a little bit different. The code is: <_a href="http://www.domain.com"_>. However, there is a space between the a and the href. Type out the words you want linked, then close it with <_/_a_>.
To add an image that is already online, you have to first get the image's URL. To find it, right-click on an image you like and look at it's properties. You'll see the URL there. Copy it then come back to your blog. To insert the image, the code is: <_img src="http://www.domain.com/image.jpg"_>. This code you don't have to close with a slash tag , / >, but there is a space in-between the img and src. However, you can add some cool stuff to the image tag to make it do stuff. These instructions go after the image's URL and " mark, but before the >. If you want the image to align to the left or right (like in Word or something), type align=left. If you want a buffer around the image, type hspace=5 or whatever number you want. That number is the number of pixels the buffer will be. You can also resize an image by typing width=200 or height=200, the number being the measurement in pixels.
So, here's an example of how an image tag would look: <_img src="http://www.domain.com/image.jpg" align=left hspace=10 width=200_>.
That's it! Now, what if that image isn't online? Oh, we'll cover that in the Blogging 201 class. See you next time!
Subscribe to Posts [Atom]
