• How do I edit the Homework?
• How do I change the Smiley Face Picture?
• How do I change the color scheme of my site?
• HTML Editor Help
• How do I add a class?
• How do I add an image?

• HELP! - Talk to the webmaster!

How do I add an image?

There are four basic steps to having your picture put on the SchoolAndTeacher website.  I will outline them first, then I will get into the details, for those who need more help.

Outline

1. Hit the Save button to save any changes to your text before you upload any pictures.  Otherwise your new changes to any text will not be saved.
2. Upload your file using the Browse, then the Upload Picture buttons.
3. Put your cursor where you want your picture added.
4. Use the to input the picture into the HTML editor.
   1. You will need to enter this numeric image name which is shown under the image.
   2. Then you will be asked for the image width you would like. (This can be smaller than the image you uploaded.) Just use a number. Sizes of about 100 will show a small thumbnail. Sizes of about 500 will show a fairly large picture.
   3. Then you will be asked to enter a short description of the picture.
   4. You should now see your picture.

Don't let the volume of the following text overwhelm you.  It is really very simple, as you will see for yourself when you do it once or twice.  Feel free to print this out to help you as you get the feel of it.  I just have a lot of explanations and pictures here for those who like step-by-step instructions.  I know many of you aren't computer wizards and may find the detailed descriptions helpful.

Details:  (If your HTML editor does not look like what you see in these images with all the buttons, scroll down to your customized instructions.)

1. Hit the save button to save any changes before you upload any pictures.  Otherwise your new changes to any text will not be saved.
2. You will have to upload your picture using the tool on the right, so they are can be reached on the web. The Browse button is used to find the file on your desktop. The Upload Picture is used to take this (found) file and put it onto the web.  Using this will add to the list of available pictures. (No one can see them yet . . . )
   
   
3. Put the cursor where you want to insert your picture in the text. 
4. Then you will have to use the  button (for pictures) and tell the name of the picture file that was uploaded (like 123.jpg)  and the size of the width.  You should see it appear.
   
   

NOTE: When you use the , you will be prompted for three questions.  How you answer these questions affects how the image will show up.   Below are explanations of these, if you are not familiar with it.     

4 a) You will need to enter this numeric image name which is shown under the image.

[explanation]

The first prompt is for the image name.  Look to the right of the HTML editor and you will see little thumbnail versions of the images you uploaded.  Under this is the name of each image in our database.

In this example, there are two images available, 654.jpg and 655.jpg.

Type in the name of the image and push OK.

4 b) Then you will be asked for the image size you would like.

[explanation]

Then you will be asked for the image width.  Enter 100 for a small image, and up to 500 for a large image.  Most of the ones in this example were 450 wide and 350 wide.

After entering the desired number, click OK.

(TIP: If this is for a class description, I would recommend keeping it under 250 so that it will fit to the left of the information in the quick view.)

4 c) Then you will be asked to enter a short description of the picture.

[explanation]

Lastly, you will be asked for a description of the image.  This is so we can put in some alternate text for those who choose not to display images.  Just describe your picture briefly here.

Once you click the OK button, your image will display.

DONE. Now save your work!

1. Learn a tiny bit of HTML - I will show you what you need below.
2. OR Upgrade your web browser.  I would recommend Motzilla Firefox.  Click here to download location for this web browser. (They even have it for the Macintosh!)

HERE are your specialized instructions. 

[NOTE: Steps 1 and 2 are the same as above. The rest is different]

1. Hit the save button to save any changes before you upload any pictures.  Otherwise your new changes to any text will not be saved.
2. You will have to upload your picture using the tool on the right, so they are can be reached on the web. The Browse button is used to find the file on your desktop. The Upload Picture is used to take this (found) file and put it onto the web.  Using this will add to the list of available pictures. (No one can see them yet . . . )
   
   
3. Here is the html for building an image on our site:
   <IMG src="Picture.aspx?img=654.jpg&width=400">
   
   You will need to type this into your text editor wherever you want to put your image. 
4. In this HTML stuff, replace 654.jpg with one of your images that show at the right of the screen.
5. Replace the 400 with a different image size if desired.
6. Hit the save button to save your stuff.  The images will show up for the students browsing your web pages.