This presentation is going to cover how to add a picture to a Movable Type Blog entry. So you have a picture that you like that you want to add your blog, and so you are obviously going to save this somewhere on your computer.
In this case, I am just going to save it into the website where want to upload it, which in this case is actually thesolarplan. So I am just going to save it into here so I know where it is on my computer. I like to keep everything lowercase, just because it helps avoid any problems, so I keep things lowercase. And I went ahead and saved this, and I save it as image 2. So now I am going to go over to Movable Type.
On the screen you can see where I can find the blog entry that I am looking for. In this case I am looking for thesolarplan and I already have an entry on here, but I want to add a new picture to it. How I am going to do that is that I go into this entry.
They (the Movable Type robots) don't know how to put it in yet because I don't even have the picture uploaded yet, right? So I need to go upload the picture. So I am going to upload the file. So this little box is going to pop up and I am going to go find the file, wherever I saved it on my computer. In this case, I saved it in my documents, thesolarplan, and there is the image that I saved, image two.
So I am going to upload that and I want to put it into an images folder within Movable Type...within my Movable Type installation. So that is going to sit inside of a directory there. So I am going to go ahead and upload that. And it has already figured out that this is approximately the size that the picture is. You can either create a new entry using this upload file or you can just get the HTML.
In this case, because we already have an entry, we are going to just grab the HTML and show this as an embedded image. And now it's going to give me the HTML that I need to take and put this into my entry.
So let's say I want to put it into the entry... Oh, let's just say, here. And so I just went ahead and just copied and pasted that text right into there. Now the image currently is as going to align wherever the line is, so we can actually add just a little bit of HTML coding, or don't have to know a lot of HTML code. But we just have a little bit of HTML code in here to say that the line equals left and make sure that I put the equal sign in there properly.
So align equals left and now I am going to go ahead and resave this entry. And it is going to go ahead and rebuild the entry. And now I can go back over. Oops. I didn't show you the entry at first. But at any rate, the original entry didn't have the image, but now I am going to go view the entry and the new entry that I just created will have that picture.
So there it is. There's the picture that I stuck in there. If I wanted to move it to the right I could go back into this entry and go, "Hey, you know, I think it would look a little better on the right-hand side." So I will stick it in there and I will switch the alignment over to the right. So I try that, go ahead and click save. Go back over to the entry.
Click refresh on the entry, and hey, it's moved to the right. So play around with it a little bit and see where you like it best in the entry itself. I mean, you could stick it right up herer at the beginning if you wanted to put it up there.
The way you would see that is to take all the code that you had from down here at the bottom. You would take all that code and stick it right up at the top of the entry. And I would like to align it to the left again, and then go ahead and click save.
Refresh the entry, and there is the picture. So try it several ways to see what you like best, but that is how you get the picture into the entry.
Hope that is helpful!