416 Agriculture Hall | Michigan State University | 517-355-3776 | http://support.anr.msu.edu | [email protected]
Title:
SharePoint Advanced: Adding An
Image to A Site
Document No. -‐ 132
Revision Date -‐ 10/2013
Revision No. -‐
2
Purpose
2
NOTE: In order to perform any of the steps in this document, you must be an owner of the
SharePoint that you wish to change or have the proper permissions from the owner to do so.
In this document, media will be pertaining to images/pictures.
ADDING IMAGE MEDIA
In this section you will be learning how to add images to your SharePoint site.
In the example below, of the “ANR Technology Services Training Site”, you will notice that an image has been placed on the left side of the screen. This image is just a web part, an image web part.
3
1. Go to the SharePoint site that you would like to add an image to. Once on the site click on the “Site Actions” dropdown menu and choosing “Site Settings”.
4
3. Hover your mouse over the image folder (left side of screen), and a dropdown menu will appear, click on this menu and:
5
4. An “Upload Document” screen will appear. Click the browse button to find the image file you would like to upload.
6
6. The file path will appear in the textbox under “Name” and to the left of “Browse”. Click “OK” to place the file in the image folder (seen in step 3 above).
7. On the next screen you will:
• Click on the “Content Type” dropdown menu and choose “Image” • Type a title for the image in the “Title” test box
7
8. Now we have to copy the URL or address of the image so we can place the image on the site. To do this, click on the title of the image uploaded (in the example below, the image uploaded was “training_words”).
8
10. Now go back to your SharePoint site. To do this: • Click on Site Settings in upper left corner
9
12. Now we have to create a web part on the page to place the image in. To create the web part:
10
13. Next click on the words “Add a Web Part”. There are two places on the page that I can click, you can choose either one.
14. In example below, the right side “Add a Web Part” was chosen. Now we have to find the “Image Viewer” web part. To find the image viewer web part do the following: • Click on the “Media and Content” folder under “Categories”
11
12
16. The image viewer tool pane will open on the left side of the page. Use this tool pane to: • Paste in the URL copied in step 9 above- you paste the URL in the text box under
words “Test Link”
• Give image an alternative text. Type a description of the image in the text box under “Alternative Text”. The description should be short, but describe the picture.
13
17. Under “Appearance” (further down) again, you can choose the “Chrome Type” or how the image will display. Under “Chrome Type” you choose:
• None – This will just show the image
• Title and Border – this will show the title (if you gave it one) and a border around the image
14
18. To stop editing the image web part, you must click on “Stop Editing”.
15
16
21. Then click on the dropdown menu, to the right of the web part and choose “Edit Web Part”.
