Using SharePoint to Create WebPages. Signing In

Transcription

1 Using SharePoint to Create WebPages Signing In 1. Open Internet Explorer 2. Type in the school URL: or teacher subsite URL 3. Select Sign In 4. Sign in using your windows user name and password 5. Click OK 6. Here s the template for your school website ready for editing Edit Page 1. Select the Site Actions button 2. Choose Edit Page 3. We re working with the Page Content web part so single click Edit Content 4. Use the Text Editor to edit the content of our Web Part 5. Use the Text Editor to format font, add images, hyperlink, add tables, etc to the Content Area 6. The 4-headed arrow moves the Text Editor around on the page as needed 1

2 7. Left click any place on the page to hide the text editor Note: Editing the font color is a little odd 1. Select the Edit HTML Button 2. When that window opens select the Edit HTML Button again 3. A new window opens highlight the text and select the Text Color Button 4. Continue working on the content Web Part in this window 5. Select the Save Button when completed Publish/Save Publishing Content for the World to See 1. When ready for changes on the page to become public, select Publish 2. This is now published to the web 3. To continue editing this page, select Site Actions and Edit Page 4. When complete and ready to publish, select Publish 5. Save the Content without Publishing 1. The content can be saved without publishing and continue working at another time 2. Instead of selecting Publish, select Page and Save 3. Save and continue working or Save and Stop Editing 4. Notice the Discard and Check Out option as well this will throw away all changes To Do this Save the page and continue to edit it. On the Page Editing toolbar, click Page, and then click Save. 2

3 Save the page, but do not allow others to edit it. Save the page and allow others to edit it. Save the page and check it in for review. Discard all of the changes that were made since the last time the page was checked out. On the Page Editing toolbar, click Page, and then click Save and Stop Editing. On the Page Editing toolbar, click Check In to Share Draft. On the Page Editing toolbar, click Submit for Approval. Click Page and then click Discard Check Out Create New Pages 1. Click on Site Actions button 2. Select Create Page 3. Type in a title for the page 4. A description of the page can be included 5. Click the URL Name box and the title name will appear for different wording for the URL change the title name now 6. Choose the desired Page Layout Style Click on the choices to see a sample page and a description of what will be on the page 7. Click the Create button 8. Publish the page once the content is added for it to show up on the published website Working with Images To share pictures in Microsoft Office documents, on Web sites, or in messages, it is necessary to reduce the size or dimension of pictures to work more efficiently. For example, pictures taken with a digital camera create large files. Putting those files into a web site can make the web site take longer to open because of its increased file size. Reduce the file size of pictures so that they load faster on Web sites or reduce the dimensions of pictures so that they fit better in a browser window. Both file size and picture dimensions can be changed by compressing the files to a smaller JPG format. Microsoft Office Picture Manager automatically determines the amount of compression after specifying how the 3

4 pictures will be used. The aspect ratio of pictures will always be maintained. If the picture is already smaller than the compression option chosen, no resizing or compression will be performed. Opening Microsoft Office Picture Manager 1. Right click on the image 2. Point to Open With 3. Then choose Microsoft Picture Manager 4. Compressing Images Using Microsoft Office Picture Manager 1. Picture Manager is open with the image visible 2. Select the Filmstrip View to select and work on one image at a time from the image folder 3. Select Edit pictures 4. The Edit Pictures Task Pane will open on the right 5. In the Change Picture Size section, select Compress Pictures 6. In the Compress Pictures Task Pane, notice the estimated size of the original image. We want to compress the image for a web site 7. Under Compress Picture Settings, click the radio button by Web pages 8. Notice how the size of the picture changed (look in Estimated Total Size) to see comparison 9. If the compression size is smaller than the compression option chosen, no re-sizing or compression will be performed 4

5 10. Once the image is compressed, save the changes. DO NOT DELETE YOUR ORIGINAL PICTURE 11. From the Menu Bar, select File>Save As 12. A window will open 13. In the Save in box, click the down arrow to navigate to the location where the pictures will be saved 14. Name the file. Here is a good place to get organized by naming pictures and clip art images so you know what they are. Don t forget to put the extension on the end of the name. Example:.jpg,.gif, ) NOTE ON NAMING PICTURES AND FILES: name any picture or file in all lower case; make the name short and recognizable. 15. Click Save 16. Name the file (if you have not already done so) remember to name it in all lower case and something easy to remember. Cropping Images with MS Office Picture Manager 1. Make sure MS Office Picture Manager is open 2. Open a picture to be cropped by double clicking 3. Click Edit Pictures 4. In the Edit Pictures Task Pane, select Crop 5. Cropping handles will appear around the picture 6. Move the mouse over a cropping handle to get the cropping tool 5

6 7. Hold the left mouse button down and drag to begin the cropping process 8. The part of the image that will be cropped out will be dim 9. Click OK when you are satisfied with the image. Resizing Pictures with MS Office Picture Manager Resizing a picture allows the dimensions of a picture to be changed. This feature can be used to enlarge a picture for printing or reduce it to send in messages or share on the Internet. 1. Select a picture to work with 2. Click Edit Pictures 3. In the Edit Pictures Task Pane, click resize 4. Select the options 5. Click OK 6. Save the image. Notice when the percentage of the original picture is changed, the size changes as well Uploading Images/Documents to SharePoint Uploading Single Images/Documents 1. Open the SharePoint site with your name 2. Enter your username and password when prompted 3. Click the tab named Site Actions 4. Click View All Site Content 5. Single click the word Images 6

7 6. Select Upload 7. Select Upload Document 8. The Upload Documents: Images window opens 9. Click the Browse button to locate an image to add to the Image Library 10. Navigate to the folder where the image is located 11. Select the image 12. Click OK 13. Be sure to Check In the Image -- Click Check In 14. The image will now appear in the Image Library Note: if desired, a folder(s) can be created to organize images within the Images folder Note: Multiple Images can be uploaded as well 1. Choose Upload Multiple Documents 2. Navigate to the location of the images 3. Place a check in the box for each image to upload 4. Click OK 5. Do you want to continue? Yes notice the images are NOT checked in. 6. These images are checked out 7. Hover over the name of the files click the drop down arrow and choose Check In 7

8 Inserting Pictures in SharePoint 1. Create a page in SharePoint by selecting Site Actions>Create Page or navigate to a previously created page 2. In the Page Content Web Part, select Edit Content 3. The editing toolbar will open 4. Select the Insert Image button 5. The following (the Edit Image Properties Web page dialog box) will open: 6. Select Browse 7. Navigate to the pictures in the Image Library 8. Click a picture to add. 9. Click Ok 10. The Edit Image Properties Web page dialog box will open again 11. The layout of the picture (middle, top, bottom, right of text ) can be changed 12. When finished, click OK 13. If the picture inserts as very large, like the example, delete the picture that was added. Then, go back to Edit Content> Select the Insert Image button 14. Now change the size of the image by clicking the radio button next to Specify Size. Type in a number (it may take some time to come up with a good size; for example begin with 250 for the width) 8

9 15. Put a check in the box next to Maintain Aspect Ratio. This will automatically put the height in so the picture stays in proportion. 16. Click OK 17. If the picture is still large, delete it by selecting it and pressing the delete key on the keyboard and go back to step 5. When you get to step 15, make the number smaller than what was first used. For example, if 250 was the number used for width, try 200. If that makes the picture a better size, continue with steps 16 and 17 Creating and Uploading PDFs Creating a PDF from MS Word Open MS Word Select the Office Button and Open 3. If the file is located in the user s Home Folder, locate that folder by selecting Computer on the left then the drive with the user s name 4. Locate the file and open 5. Select the Office Button and point to Save As 6. Select PDF or XPS 7. Select the location to save 8. Name the file 9. Select Publish Upload the PDF to SharePoint A PDF is uploaded like an image file, except to the Documents Folder 1. Select Site Actions 2. Select View all Site Content 3. Select the Documents folder 4. Select Upload, then Upload Document 9

10 5. Select Browse and navigate to the file that is to be uploaded 6. Select Open; then OK the document 7. Be sure to Check In 8. The file is uploaded to the Documents Folder Link to Files using the Text Editor in the Page Content Web Part 1. Navigate to the page from which the file is to be linked 2. Select Site Actions then Edit Page 3. Select Edit Content 4. Type the text for the hyperlink 5. Highlight the text 6. Select the Hyperlink button 7. Select Browse to locate the file 8. We put the PDF in the Documents folder, so select the Documents Folder 9. Select the file then OK 10. Select OK again 11. The text is hyperlinked Remember to save or publish your changes -- Link to Files Using the Summary Links Web Part As well as hyper linking in the Page Content Web Part, hyperlinks can appear in the Summary Links Web Part. 10

11 One way to work with Summary Links is to change the page layout to Welcome Page with Summary Links (Edit Page Page Button Page Settings) Another is to Add a Web p\part (Page Add Web Part Browse from the Web Part List choose Summary Link Web Part) To work with the Summary Links Web Part 1. Select New Link 2. The Title is the text that will be hyperlinked for example use the name of the website 3. Link URL is the web address. Instead of trying to type in the URL, go to the website and copy the URL from the address window. Paste the URL in the Link URL window 4. Select OK and a hyperlink is added in the Summary Links Web Part 5. Additional links can be added in the same manner Remember to save or publish your changes --\ Delete Documents, Pages and Images 1. Site Actions 2. View All Site Content 3. Select the.. a. Documents Folder for documents b. Images Folder for images c. Pages Folder for web pages 4. Hover the mouse over the file name and select the drop down arrow 5. Select Delete 11