Google Sites: Picture Links How-To


This Site has moved here (or click on links below to redirect)

Make a Picture a Link 

To make an image a link to another page or website (like on this template):
  1. click on the pencil edit screen pencil to edit the page (top, near-center)
  2. insert an image (from Picasa of your computer) to your site in the place you want the link
  3. in a separate window/browser tab, go to the page you want the picture to link to and copy the URL, for example www.pageiwanttolinkto.com
  4. back in your website and while in edit mode (click on the pencil), click on the image you want to be a link
  5. if you see a toolbar image toolbar with link with the blue link and the option to "change" the link, follow these directions 
    1. click on "change" in the toolbar (right side) 
    2. in the box labeled "Link to this URL:" paste the web address of the site you want to link to (from step 3 above)
    3. click "Ok"
    4. click "Save" to save and view changes
    5. click on the image-link you just created to verify that it works

  6. if you see a toolbar image toolbar without link  without the option to "change" the link, follow these directions (*note* this will require modifying the html. If you are not comfortable with that, try inserting the picture again and see if the "change" option is there)
    1. while in edit mode (click on the pencil), click on the area of the webpage where your image is
    2. click on <HTML> (top)
    3. search the html for your image (hint: use the find function (ctrl f (PC) or command f (Mac) and search for img or the name of the image you added) you should find something like this:

      <img src="https://sites.google.com/site/julie1schlafersharma/
      sampleimage.jpg" border="0" alt="imagesample">

    4. in the html, add this

      <a href="https://sites.google.com/site/julie1schlafersharma/samplelink">

       directly before the highlighted <img> text above, replacing the       red text with the web address of the site you want to link to (copied in step 3 near top of instructions)

      to give you: 

      <a href="      www.pageiwanttolinkto.com">
      <img src= "https://sites.google.com/site/julie1schlafersharma/
      sampleimage.jpg">

    5. add this

             </a>

      after the above text, to give you:

      <a href="www.pageiwanttolinkto.com">
      <img src= "https://sites.google.com/site/julie1schlafersharma/
      sampleimage.jpg      ">      </a>

      (*note* your text should look different from the highlighted areas of text because you are using a different image and linking to a different page (and might have different size and border settings). Also, instead of

      .jpg"

      you might have something like this:

      .jpg?height=100&amp;width=100" title= "samplepicturename" width="100"

    6. click "Update"
    7. click "Save" to save and view changes
    8. click on the image-link you just created to verify that it works
Check our more hints here!
questions or comments?

Comments