1. Foxbright – Smarter Education Websiteswww.foxbright.com Foxbright Training Foxbright Teacher Pages http://support.foxbright.com support@foxbright.com

2. Foxbright – Smarter Education Websiteswww.foxbright.com Teacher Pages Overview of Teacher Pages Training –www.eastlansingPD.weebly.com (PD Topics > Foxbright)www.eastlansingPD.weebly.com Teacher Pages –Weebly or Planbook or Foxbright? –Logging in –What am I editing? –Contact info –Welcome page –Teacher page content –Finally – adding & editing pages

3. Foxbright – Smarter Education Websiteswww.foxbright.com System Login You will be required to login: Go to ELSP.us > Staff Links > Foxbright Teacher Pages

4. Foxbright – Smarter Education Websiteswww.foxbright.com Welcome Page Teacher Home / Welcome Page –Small Bio including Years Teaching, Experience, Specialty & Professional Development –May also include: Homework Schedule Calendar of assignments, tests, projects, etc. Helpful links for students –You can also create additional pages for Different Subjects that you teach Projects Field Trips

5. Foxbright – Smarter Education Websiteswww.foxbright.com Update info & add photo Select My Information –Click on your name to get the dropdown menu

6. Foxbright – Smarter Education Websiteswww.foxbright.com Update Profile Photo Scroll down to see the Photo and Profile Select New Photo

7. Foxbright – Smarter Education Websiteswww.foxbright.com Upload New Photo You will be asked to Select a File

8. Foxbright – Smarter Education Websiteswww.foxbright.com Upload New Photo Browse for your photo image When you have it selected, select “Open”

9. Foxbright – Smarter Education Websiteswww.foxbright.com Upload New Photo You will now see your photo and you have options to “Crop” and “Resize”

10. Foxbright – Smarter Education Websiteswww.foxbright.com Upload New Photo Resize and move window to portion of photo that you want and select Preview.

11. Foxbright – Smarter Education Websiteswww.foxbright.com If you are happy with it, select “Save” Otherwise select “Undo Crop” Upload New Photo

12. Foxbright – Smarter Education Websiteswww.foxbright.com Select “Save” when satisfied Upload New Photo

13. Foxbright – Smarter Education Websiteswww.foxbright.com Teacher Pages Select “My Pages” Tab You will see your pages

14. Foxbright – Smarter Education Websiteswww.foxbright.com Teacher Pages You can update your Page Name –Click on Gear next to your page –Select “Settings”

15. Foxbright – Smarter Education Websiteswww.foxbright.com Teacher Pages Enter a new Page Name –The other fields will automatically update –Select Save

16. Foxbright – Smarter Education Websiteswww.foxbright.com Teacher Pages You can also add pages –Click the Gear and Select “Add Page”

17. Foxbright – Smarter Education Websiteswww.foxbright.com Teacher Pages Enter a name for your page. –The system will fill out the other fields –Save the page.

18. Foxbright – Smarter Education Websiteswww.foxbright.com Editing Page Content Click on the page name to edit the page

19. Foxbright – Smarter Education Websiteswww.foxbright.com Editing Page Content Click Edit in the box to open the edit window.

20. Foxbright – Smarter Education Websiteswww.foxbright.com Add Page You will see an empty page if you just added the page –The red outlines indicate where you can add content –Click or hover over a red box to view action options –Select the Edit option

21. Foxbright – Smarter Education Websiteswww.foxbright.com Editing Page Content Click in the box and start typing to enter text Use the “Format” drop to change font size and color. Save your changes

22. Foxbright – Smarter Education Websiteswww.foxbright.com Page Editor Frequently Used Tool Bar Icons –Insert Link Document (Word, PDF) Website page –Insert Photo –Insert Multi Media Video or Audio – Paste Use the Paste from Word function to have your formatting converted to the available formats on your website.

23. Foxbright – Smarter Education Websiteswww.foxbright.com Page Editor Frequently Used Tool Bar Icons –Format Styles to change format –Snippets Inserts an icon Use these when linking to documents

24. Foxbright – Smarter Education Websiteswww.foxbright.com Page Editor –Preview – this allows you to view the page to make sure everything looks correct –Publish – this allows you to publish the page to make it live on the website. –Close – this closes the Page Editor and returns you to your “My Pages” View

25. Foxbright – Smarter Education Websiteswww.foxbright.com Inserting Links You can Add 3 types of links: –Link to a Document (Word, PDF, Excel) –Link to an External Web Page –Link to a page on your web site

26. Foxbright – Smarter Education Websiteswww.foxbright.com Link to Document Step 1 – Create Link Text Enter Link Text and Select Text using mouse Select the “Link” icon

27. Foxbright – Smarter Education Websiteswww.foxbright.com Link to Document Step 2: Upload Document –Select Browse for Link button –Choose select file

28. Foxbright – Smarter Education Websiteswww.foxbright.com Link to Document Step 3: Find File Click the name of the file to add it or, Select Add File to upload a file

29. Foxbright – Smarter Education Websiteswww.foxbright.com Link to Document Step 4: Upload the file –Select A File –Select the Category “My Files” –Enter a Name –Enter a Description (optional) Select Save button –You will see a progress bar while the file uploads –You will now see your uploaded file on the category you chose from.

30. Foxbright – Smarter Education Websiteswww.foxbright.com Link to Document You now have uploaded a document and added a link to it on your web page. The link will be highlighted in the editor To Test Link: Save content block Select “Preview” (upper right)

31. Foxbright – Smarter Education Websiteswww.foxbright.com Link to External Web Page Step 1: Find the web page & copy the URL Click on the address Make sure the address is highlighted Select Copy

32. Foxbright – Smarter Education Websiteswww.foxbright.com Link to External Web Page Step 2: Create Link Text Enter Link Text and Select Text Select the “Link” icon Paste the URL in URL field and click OK

33. Foxbright – Smarter Education Websiteswww.foxbright.com Link to Page on your Site Step 1: Create Link Text Enter Link Text and Select Text Select the “Link” icon

34. Foxbright – Smarter Education Websiteswww.foxbright.com Link to Page on your Site Step 2: Find Page Click on “Browse for Link”

35. Foxbright – Smarter Education Websiteswww.foxbright.com Link to Page on your Site Step 2: Find Page The + symbol reveals subpages If you know the name of the page you can search for it Click on the page you want to link to –I’ll choose athletics

36. Foxbright – Smarter Education Websiteswww.foxbright.com Link to Page on your Site Step 4: Insert Link The chosen internal link will now be in the URL field Select OK

37. Foxbright – Smarter Education Websiteswww.foxbright.com Link to Page on your Site You now have added a link to “Athletics” The link will be highlighted in the editor You can Save & Preview the page to test the link

38. Foxbright – Smarter Education Websiteswww.foxbright.com Inserting Photos or Multimedia Inserting Photos –You can insert pictures on your web page –If you want a slideshow or have a lot of photos, please see Using the Photo GalleryUsing the Photo Gallery Inserting Multimedia –If you have a video or voice file hosted on a third party streaming site such as vimeo or youtube, you can get the embed code from your video and paste it in the window that opens after clicking the multimedia button.

39. Foxbright – Smarter Education Websiteswww.foxbright.com Add Picture Step 1 – Picture Location Put your cursor location to where you would like to add the picture Select the “Insert Image” icon

40. Foxbright – Smarter Education Websiteswww.foxbright.com Add Picture Step 2: Upload Picture –Select Browse Server For Image

41. Foxbright – Smarter Education Websiteswww.foxbright.com Add Picture Step 2: Upload Picture –If the image has already been uploaded, you can find the file in the list. Clicking on the title will select it, or: –Click Add Image to upload a new image.

42. Foxbright – Smarter Education Websiteswww.foxbright.com Add Picture Step 2: Upload Picture –Choose the “my files” –Click Select New File to choose the image from your computer. –Give your image a name and choose save. –Your file will be added to the list for selection as showed in previous slide.

43. Foxbright – Smarter Education Websiteswww.foxbright.com Add Picture Step 3: Find File Once the image is selected you can change its size and alignment. Hint: Make sure the lock is always locked to maintain aspect ratio Once satisfied, choose OK and the image will be added to your page.

44. Foxbright – Smarter Education Websiteswww.foxbright.com Add Photo Step 6: Resize Photo If the photo is large, you may need to resize it so you can view it Click on the photo to select it –You can grab a corner a resize it –Save your updated content.

45. Foxbright – Smarter Education Websiteswww.foxbright.com Add Media Step 1: Get the Embed Code –Copy the Embed Code from the streaming service, such as youtube or vimeo, for the video. Most of these site allow you to change the video size and other options before generating the code

46. Foxbright – Smarter Education Websiteswww.foxbright.com Add Media Step 2 –Video Location Put your cursor location to where you would like to add the Video or Audio Select the “Insert Multimedia” icon

47. Foxbright – Smarter Education Websiteswww.foxbright.com Add Media Step 3: Paste Embed Code Paste the Embed Code in the Embed Media Window and choose OK

48. Foxbright – Smarter Education Websiteswww.foxbright.com Add Media The video (or other media) will now be displayed on your page. Save the content window.

49. Foxbright – Smarter Education Websiteswww.foxbright.com Calendars The system will allow you to have 1 or more calendars –Test Dates –Homework Assignments –Project Dates

50. Foxbright – Smarter Education Websiteswww.foxbright.com Add Calendar Step 1 – Calendars Tab Select the Calendars Tab Choose Add Calendar

51. Foxbright – Smarter Education Websiteswww.foxbright.com Add Calendar Step 2: New Calendar Give your calendar a name. Save your new calendar Note: If you have a Google Calendar you want to use See Google CalendarsGoogle Calendars

52. Foxbright – Smarter Education Websiteswww.foxbright.com Add Event Now you can add events to the Calendar Select Add Calendar Event under the Calendars tab Choose your calendar from the dropdown list. Give your event a title and dates. Unselect “All Day” to enter a start and end time You can also add a file, such as a permissions slip.

53. Foxbright – Smarter Education Websiteswww.foxbright.com Add Event Enter Event Description If you want to add more information about your event, such as a link or assignments, add it in the Event Description. Save your calendar

54. Foxbright – Smarter Education Websiteswww.foxbright.com Add Calendar to Page Now that you have a calendar you will need to add the calendar to your page. First you should determine the presentation you want to use: –Mini Calendar –Upcoming Events

55. Foxbright – Smarter Education Websiteswww.foxbright.com Calendar Presentation Options –Upcoming Events Shows events for the next number of days You can configure number of days Best displayed in side column –Mini Calendar On mouse click shows events for that day Best displayed in side column

56. Foxbright – Smarter Education Websiteswww.foxbright.com Calendar Display Options Multi-Calendar Agenda View –This is the month view and should have a dedicated page

57. Foxbright – Smarter Education Websiteswww.foxbright.com Add Calendar to Page Now that you have a calendar you will need to add the calendar to your page. From My Pages edit the Page you want to add the calendar Choose Add Block where you want to add the calendar Select the calendar style from the dropdown list Click Add Block

58. Foxbright – Smarter Education Websiteswww.foxbright.com Add Calendar to Page Choose which calendar(s) to display. You may see more options based on the calendar display. Set iCal enabled to “Yes” so students and parents can subscribe to your calendar

59. Foxbright – Smarter Education Websiteswww.foxbright.com Support & Help Desk Remember Save and Preview often. Always preview your changes before Publishing your page Foxbright has a variety of other tools to customize your page such as Newsletters and Photo galleries. Visit support.foxbright.com for more details. You may need to contact your web administrator to get permission to use other features. If you get stuck, please email: support@foxbright.comsupport@foxbright.com –Include your name and the page you are working on –Describe the problem –Provide a phone number as we may want to call you!