Empowering Teachers to Be Webmasters for E-learning & E-services

1. Be a Webmaster in 90 Minutes Empower teacher webmasters for today's e-learning and tomorrow's e-services. By Raffy Mananghayarsmananghaya@uplb.edu.ph

2. Why Use Internet Server in Schools • PH Office of the President has promoted IT in schools/ offices since 2002 • Universal internet access has been a global goal since WSIS 2005 • Students are now IT-ready (smartphones are actually personal computers) • Need authoritative educational resource created by authoritative educators

3. Examples of Educational Servers • Wikipedia (a nonprofit) • Khan Academy (nonprofit, by Salman Khan, an ethnic Indian-Asian in the US) • Open Course Ware (MIT, US) • Gutenberg Project • All are not for profit • Salman Khanstarted on his own

4. Are we ready for IT in Schools? • Do we find ourselves in the Internet, particularly in educational websites? • Do we broadcast/ keep ownership of original educational material? • Are we able to create Internet-like experience in the classroom? • We want the answers to be “Yes”.

5. Our Course Objectives • Enable teachers to become webmasters • they shall be able to use interactive webpages and tests in class (e-learning) • they shall be able to train students to get started as webmasters (of future e-services) • To do (using own server) • start the server on his/her own • create a personalized webpage • create a quiz and link to it

6. 1a - Start the Server • Get/ Extract a-server.zip to hard disk C • Start the server: Double-click go.bat

7. 1b - Allow through Firewall • Allow access by checking on networks

8. 2a – Prepare Connection Wired connection to server is preferred • Get IP Addressof Server • cmd • ipconfig

9. 2b - Connect to Server • Enter IP Address in browser 192.168.X.X (or name of PC) Mobile View PC View

10. 3 - Administer Content myweb.php (can be renamed) • Edit (htm,txt); Upload files; Test template

11. 3a - Editing htm File • Wysiwyg editing in a window with buttons

12. 3a - Editing htm File • Inserting a picture (uploaded previously) First, place cursor where picture should appear

13. 3a - Editing htm File • Inserting a link (previously copied) First, select imageor text

14. 3a - Editing htm File • Formatting text (No paste from Word pls!) • Paragraph; heading 2 or 4; pre (as typed) Format before typing or apply on selected text

15. 3b - Editing txt File • nav.txt for menu; Home-side.txt for sidebartitle.txt for page title; banner.txt for banner • Whennotto beused,delete orchangefilename

16. 3c - Uploading File • htm, txt, pdf, gif, jpg, png, q (test questions) • To see list of uploaded files, click Files

17. 3d - Test Template

18. 3d - Test Entries • Enter question (0),answer choices (1-5),clue (9) Avoid usingquote “ in entries, use ` instead

19. 3d - Test Announcement • Get test URL after uploading test q First, right-click on question file • Insert test URL in webpage

20. 3d - Test Record + Analysis • Click on test tally t • Note: Difficult questions will result to low %

21. Tips and Tricks – Use Tabs • You can work on editing, viewing, testing or uploading at the same time by using multiple browser tabs.

22. Tips – Common Problems • When looking in the folder c:/a-server/www, the filenames have no extension (htm, txt, q, t)Solution: Make Windows un-hide filename extension* • When double-clicking on the test template q, nothing happens (Notepad does not open it)Solution: Make Windows open it with Notepad* • When I open Home.htm with Notepad, I see a jumble of letters, no spacing or paragraphs!Solution: Use only your browser (myweb.php) to edit htm files • files.php in Notepad also shows a jumble of letters!Open files.php in Notepad only to change username & password * A tutorial for this is provided at aralinserver.org

23. Tips – Pictures and Videos • Crop the right view/ content (MS Paint can do this) • Or scale/ resize to the right width 734px width maximum 510px maximum (if using side column)MS Picture Manager or free software like Irfanview can do this • Save to png type of file when changing the picture so that its quality does not degrade • Remember: For file names, use small letters, no blanks • Place link to a video over a picture (more pretty)

24. Tips – Banner and Navigation • Upload banner.png to use a banner picture(limit it to 740 pixels width) • If you upload banner.txt, it will be shown as banner text (but banner.png prevails if banner.png exists) • Navigation - line of links under the banner to point the reader to page/ file locations- Put primary links in nav.txt- Put secondary links in Home-side.txt • You can insert navigation in pages: links are separated with | and the line is centered, example:SciLesson-01 | SciLesson-02 | SciLesson-03

25. Tips – Font Choice • Default font is Georgia,a serif font that looks attractive in newer PCs like Win7 and mobiles • Change font in style.csssee /codes/css • Minimize fontedits in pages!

26. Tips – Linking • Use short name (no blanks) for page nameslink to the page Home.htm: ?page=Home.htm <a href="?page=Home.htm">Home</a>link to the test MathQuiz-01: test.php?test=MathQuiz-01<a href="test.php?test=MathQuiz-01">our first Math quiz</a>link (external) to a Youtube video: http://youtube.com/watch?v=W5ySOqtxhbw<a href="http://youtube.com/watch?v=W5ySOqtxhbw">Negroponte</a>link (local) to a video: http://localhost/files/negroponte-ted-talk-2006.flv<a href="/files/negroponte-ted-talk-2006.flv">Negroponte</a> • Notice the url pattern: <a href="location">description</a>Server is http://localhost - all file URLs are based on this location(http://localhost can therefore be removed from the local url)

27. Tips – File Management • The user’s files are in the folder c:\a-server\www (in Windows style of writing folders)c:/a-server/www (in the server style of writing folders) • Because these files are in your computer, you can rename or delete them through Windows Explorer. Important cautions: - only rename txt files (when hiding or un-hiding webpage elements, such as nav.txt, Home-side.txt, banner.txt, title.txt) - only delete template-test.q files (test templates)Other changes should be done through your browser • To delete files through the browser, run files.php and login with username myweb and password .phpYou can change this username and password by changing$_CONFIG['users'] = array(array("myweb",".php","admin"));in files.php (use Notepad to edit the file)

28. Thank you! • raffym@gmail.com • 0916 772 8558