How to Build a Great Class Website Using Weebly

5 862 vues

Publié le

Publié dans : Formation, Technologie, Design
0 commentaire
3 j’aime
  • Soyez le premier à commenter

Aucun téléchargement
Nombre de vues
5 862
Sur SlideShare
Issues des intégrations
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

How to Build a Great Class Website Using Weebly

  1. 1. How to Build a Great Class Website or Blog<br />Presented by Tim and Sara Macmillan<br />QSI Fall PD Session<br />Oct. 21st, 2011<br />
  2. 2. By the end of this workshop, you will:<br /><ul><li>Have created a basic blog or website
  3. 3. Have designed a basic layout for your site considering the needs of your students and parents
  4. 4. Know how to embed documents, photos, videos, and games to make your site more interactive</li></li></ul><li>Choosing Your Host<br /><br />
  5. 5. Other Options:<br /><br /><br /><br /><br /><br /><br /><br />
  6. 6. A Video to Help with the Basics<br />
  7. 7. Step One: Name Your Site<br />e.g. Mr. Smith’s 6 Year Old Class<br />
  8. 8. Step 1: Log in to Weebly and click ‘Edit.’<br />Step 2: Click ‘Settings’ from the tabs at the top of the screen.<br />Step 3: Type in a new site title.<br />Step 4: Click ‘Change site address and type in your new title to see if it is available and press continue. <br />
  9. 9. Step Two: Choose a Theme<br /><ul><li>Think of your audience
  10. 10. Avoid overly dark themes
  11. 11. Choose easy to read fonts</li></li></ul><li>Choosing a Theme<br />1. Select ‘Design’ from the tab at the top.<br />2. Click‘All Themes’ and select ‘Education’<br />3. Select a theme and click ‘Preview.’<br />4. Click ‘Use Theme.’<br />
  12. 12. Step Three<br />Decide on a Layout<br />
  13. 13. Questions to Ask Yourself:<br /><ul><li>Who is your site for?
  14. 14. Will you have content for students? How will it be organized (i.e. by subjects)
  15. 15. Will you have content for parents?
  16. 16. Do you want a blog (more interactive) or a website or both?</li></li></ul><li>Step Four: Adding Pages<br />Click on the tab ‘Pages’ at the top of the screen.<br />Click ‘Add Page’<br />Title your page and click ‘Save Settings.’<br />Repeat for all desired pages<br />
  17. 17. Example:<br />
  18. 18. Step Five: Rearranging Pages<br />
  19. 19. Think back to your thoughts on organization!<br />
  20. 20. Step 1: Click and drag pages to better organize your tabs.<br />Step 2: To create subtabs, drag under and over slightly from tab and release.<br />Tab<br />Subtabs<br />Step 3: Click ‘Save Settings.’<br />
  21. 21. Step Six: Adding Basic Elements<br />
  22. 22. Step 1: Locate the ‘Elements’ tab at the top of the screen.<br />Step 2: Locate the four categories of elements. <br />Step 3: Click on ‘Basic.’ You should see the elements below.<br />
  23. 23. Step 4: Click on ‘Paragraph with Title’ and drag to the home page.<br />Step 5: Type in the title for your page.<br />Step 6: Type in your welcome message. (Note: a welcome message should only stay on the site for the first couple of weeks after publishing.)<br />
  24. 24. Step 7: Click on ‘Picture’ and drag to the home page.<br />Step 8: Click on the sample image.<br />Step 9: Click on the green bar to upload a file from your computer.<br />
  25. 25. Step 10: Alternatively you may search the internet for a photo.<br />Or enter an image URL.<br />
  26. 26. Step Seven: Adding Multimedia<br />
  27. 27. Step 1: Click on ‘Multimedia’ from the elements bar.<br />Note: Some options are for pro users only!<br />Step 2: In a new tab, open the site YouTube.<br />
  28. 28. Step 3: Search for a topic-related video for your class.<br />Step 4: When you find a video you like, copy its URL.<br />Step 5: Return to the Weebly tab and drag a YouTube element to the page.<br />
  29. 29. Step 6: You should see this image. Click just outside the YouTube frame.<br />
  30. 30. Step 7: You should see this bar. Paste the video URL in the box.<br />Step 8: Choose the size of the video and its position. Click on the outer margin of your page and you should see your video.<br />
  31. 31. Step Eight: Adding Games<br />
  32. 32. Step 1: In a new tab, go to the site<br />Step 2: Choose a game you think would be appropriate for your students.<br />Step 3: Click on ‘Free Link to Game.’<br />
  33. 33. Step 4: Next to ‘Embedded Game’, you will find the code. Copy the code and return to Weebly.<br />Step 5: On the basic elements, drag the HTML icon to the page you want. <br />
  34. 34. Step 6: You should see the words below. Click to add the HTML code.<br />Step 7: Paste in the code and choose the alignment.<br />Step 8: You should now see the game embedded on your site.<br />
  35. 35. Step Eight: Embedding Documents<br />
  36. 36. Step One: In a new tab, go to the following site: <br /><br />Another good site is:<br /><br />Step Two: Upload a pdf file to receive an html code. Drag down the HTML element to the page you wish and paste in the code.<br />
  37. 37. Step Nine: Adding Photo Slideshows<br />
  38. 38. Step One: In a new tab, go to the following site and register (They also give free upgrades to educators to make full length video slideshow!): <br /><br />Another good site is:<br />Step Two: Upload a photos to create a video. Submit to receive an HTML code. Drag down the HTML element to the page you wish and paste in the code.<br />
  39. 39. Great work!<br />You now have the beginnings of a great class website/blog!<br />