| Adding Images |
| Written by Peter Garver, SABR staff |
| Friday, 16 January 2009 13:05 |
|
The software that powers the site can resize images for you, so all you need to do is upload the image, set the size, and it will display properly in your pages. This tutorial will tell you how. You can click on any of the images in this article to show them larger. You will first need to be in the editor, working on an article. You can see in the image below that I captured it while editing this article. This mouse pointer in the image is over the "add image" button. Click this button to get started. When you click the image button, the screen should dim and a box should pop up that looks like the second picture. The next step is to click the "Upload" tab in that box. As you can see, I've done that already in the picture below. I also used the "Browse" button to find the image that I wanted to upload on my computer. In this case, it was the first image for this article. Once you've chosen the image, click "Send it to the Server", and it will be uploaded. This may take a bit, but when it's done you should have a window pop up telling you "Your file has been successfully uploaded", and when you click OK, you will be taken to this screen: You can see in the picture just above this text that the width and height of the image are displayed as options that you can change. This is one of two ways to set the size of the image. If you set the width to a value that well display well for most people - somewhere between 500 and 700 is good for most images - it will automatically set the height to be proportional. When you're done, click OK to see how it looks. (The images in this article are all 700 pixels wide) If you choose not to enter a new width in the dialog box, you can resize the image after clicking OK. Click anywhere on the image, then find a corner of the image and drag it toward the center to make it smaller. If the image is very large, you may have to drag it a few times to get it to the size you'd like. You can use the "Align" option in the dialog box to wrap text around the image. "Left" and "Right" are the most useful values - try them to see how it works in practice. If you fill in the "Alternative text" section in the box, it will automatically caption your pictures, like the ones in this article. When you are done editing the article, view it and ensure that your images are displaying the way you'd like them to: Everything seems to be working fine! |
| Last Updated on Monday, 23 November 2009 14:42 |