Page Module - Composing a Web Page
Margarita Berezyanskaya
Last Update vor 2 Monaten
Course content can be developed directly in an online course using the Page module. Content created with the Page module is in HTML format using the standard text editor, which provides many formatting options and a lot of flexibility in page design. The Page module supports text, images, audio, video, tables and links to other web sites and local files. Instructors who use the HTML source editor option are able to embed content from the Internet by copy-pasting the HTML code that can be copied from other web sites, such as YouTube or Google maps.
Because the Page module produces content that is generated using HTML format, it can be accessed using all types of web-enabled devices including tablets and smartphones.
Using the Page Module to Support Blended Learning
There are many different ways for instructors to use the Page module to blend face-to-face training with the online environment. Pages can be used to present static information, but they can also have interactive capability when developed using the HTML source editor.
Pages can also be useful for instructors taking a flipped approach to instruction. Using the flipped approach, instructors assign a Page to learners with a task to complete before the face-to-face class. During the in-class session, learners collaborate to engage with the concepts introduced in the pre-class task.
Exemplar
The Preparing for Job Interviews link in the Stage 2/3 Exemplar course displays a Page with a speaking task for students.
Adding a Page to a Course
1. On a course, click on the Turn editing on button.
2. Click the Add an activity or resource link in the appropriate topic/section.
The Add a new activity or resource pop-up appears.
3. Select the Page icon.
4. In the General section, type a brief, descriptive Name for the Page. This name will be used as the link to the Page.
5. Type a Description of the Page to be composed.
6. Compose the web page in the Page content text box in the Content section. The Text editor is the same editor found in other Moodle tools.
7. When the Page content is satisfactorily formatted and ready, click Save and display to view the Page.
Tips for Using the Text Editor
- The editor offers many features. There are options to change the style and size of text. Text headings should be revised using the Paragraph drop-down menu to provide more consistent formatting across a course.
- Text can be copy-pasted from MS Word into the Page content text box; however, text formatted in Word may not transfer properly into the Moodle interface. If the text is not able to be re-formatted successfully, it may be better to copy-paste the text from Word into a plain text editor like Windows Notepad and then copy-paste the source text into the Moodle Page editor.
- For those with knowledge of HTML (HyperText Markup Language) clicking the HTML icon allows editing of the Page layout or pasting of code to embed content from other sites.
Embedding a Google Map into Page Content Using HTML
These instructions explain how to embed a Google map into a Page. The same process can be applied to embed other websites into the Page.
First, follow the instructions below to find the HTML code for a Google map.
1. Type the desired location into the Google search engine.
2. Click the Maps tab.
3. Ensure that the map to be embedded appears in the current map display. If there are multiple locations with the same name, choose the one that you searched for.
4. Click the Share icon.
5. Click on Embed a map.
6. Click the drop-down menu beside the embed code to change the size or to choose a custom size in the window that appears.
The size of the preview map changes as different options are selected. The embed code also updates.
7. Click on the COPY HTML link.
8. Click the Edit HTML source button in the text editor toolbar of your Page content text box.
The text editing window changes to an HTML source editor.
9. Copy the embed code from your Google Map. You can right-click and select paste OR use the keyboard shortcut, Ctrl+V (Windows) or Cmd+V (Mac), to insert the code into the HTML source
editor.
10. Click the HTML button again and the map is displayed in the Page content text box.
11. Click Save and display to view the Page.
Video Resources
Resources