Adding Pictures to your website

Pictures are vital to the look and feel of your site. They are also slightly more difficult to deal with, as you need to consider the following:-
  • Which Pictures do you want
  • Where to get them from
  • Copyright issues
  • The Shape of the pictures to fit on your site
  • How to use photo editing software
  • The types of files that will stop your images distorting when you resize them
  • The size of the file, you may wish to reduce the resolution of your pictures as large files can take time to load and will slow down your website.
We recommend that you choose your pictures, and decide where you want them to be placed on your site, then subject to your experience in this area, you may wish to seek some assistance. We would of course be happy to help.
However, what follows is a process for adding pictures.

Adding Pictures within your HTML Content

Let us suppose that we want to add a picture of a "Black Hole" to illustate the amount of time effort and money we spent on our website before we discovered CareAbout.

A Step by Step Approach

  1. Find the picture you want, this could be from a camera, or a web site etc
  2. Goto the site in this case http://space.about.com/od/blackholes/ig/Black-Holes-Pictures-/Globular-Cluster-M31-G1.htm
 
3. Press the Print Screen button on your PC which will copy the whole screen image to your clipboard. Open MS Paint.  (Start, Run, mspaint, OK, File, New)
4. Your Clipboard is still carrying the image so press Control V, you will probably be told it is too big, just say yes.
5. Use the “Crop” tool to highlight the area you want, then Control C to Copy the cropped area into a new file. (File, New File, Control V to paste your cropped image). Use File Attributes to scale to the Size you want
6. You now want to save this file to your PC. Consider opening up sub directories within your My Pictures folder. From mspaint File, Save as, Change the file type to PING or JPEG, give the file a useful name and save into your "My Pictures" sub directory
7. Open your Admin Home page and Click on the relevant page to edit, Goto the HTML Content editor, scroll down to the HTML Editor, open the picture editor, (Postcard below 1st one)
 
Click on Browse Server
 
 
 
Click on Upload, this time choose a different picture
 
 
 
Browse for your picture, send it to the server, by clickinh "Upload Selected File"
 
 
Click OK
 
 
This is the point where you can decide on how large your image will be on your website. This is done by changing the width. Note that the height changes with the width. This will keep your image in proportion. Note you can change it later. (Guide 300 width is about 4 inches 600 is about 7 inches)
 
 
 
Update Widget
 
Congratulations. You have now successfully imported a picture into HTML content, of a size of your choice.
 
 
Next Step        GOTO "Embedding Surveys"
Marketing Support