Adding Resources

Resource types enable almost any kind of web content to be inserted into the course.

  • Book is a multi-page resource in a book-like format, with chapters and subchapters, useful for displaying lengthy information. 
  • File provide a downloadable Word document, a PDF, an Excel spreadsheet or PowerPoint slides as a course resource.
  • Heading enables text and optional icons to be inserted among activities on the course page.
  • Label enables text and multimedia to be inserted into the course page between links to other resources and activities.
  • Page can display text, images, sound, video, web links and embedded code, such as Google maps. 
  • Subpage no longer available to add. Existing subpages are still visible in courses on the site.
  • URL The URL module enables a teacher to provide a web link as a course resource.


Previous
Next

1. Add a book

1.8. Add a click-to-reveal activity to a Moodle book page

Click-to-reveal is the type of activity useful for posing a question or scenario for learners to think about and possibly write about before they click to see a discussion piece of further perspectives.

Moodle book is Javascript-friendly, so you can experiment with JS functionality to add click-to-reveal activities. 

The following Javascript code can be added into the book page html for a click-to-reveal activity (there are a couple of appearance choices below):

Javascript: click-to-reveal

<script type="text/javascript">

    function toggle(obj) {

        var obj = document.getElementById(obj);

        if (obj.style.display == "block") obj.style.display = "none";

        else obj.style.display = "block";

    }

</script>

<p><a href="javascript: void(0);" onclick="toggle('reveal')">Click here to read more</a>.</p>

<div id="reveal" style="display:none;">

    <hr>

    <p>Reveal text here</p>

    <hr>

</div>


The above code produces the following click-to-reveal format:


Click here to read more.


Note: If you are including more than one click-to-reveal per page, please give the highlighted div id attribute a different name for each, e.g. "reveal1", "reveal2" etc.


Activity with comment (Javascript)

<table width="100%" border="1" style="background-color: #d9e2f3">

    <tbody>

        <tr>

            <td width="" valign="top">

                <p><img src="https://www.open.edu/openlearncreate/pluginfile.php/687993/mod_book/chapter/28050/reflection_icon_35.png" alt="" width="32" height="32" class="img-responsive atto_image_button_text-bottom"></p>

                <p><strong>Activity name</strong></p>

                <p>Text here</p>

                <script type="text/javascript">

                    function toggle(obj) {

                        var obj = document.getElementById(obj);

                        if (obj.style.display == "block") obj.style.display = "none";

                        else obj.style.display = "block";

                    }

                </script>

                <p><a href="javascript: void(0);" onclick="toggle('comment')">View comment</a></p>

                <div id="comment" style="display:none;">

                    <p>Comment</p>

                </div>

            </td>

        </tr>

    </tbody>

</table>


The above code produces the following click-to-reveal activity:

Activity name

Text here

View comment


Note: If you are including more than one activity-with-comment per page, please give the highlighted div id attribute a different name for each, e.g. "comment1", "comment2" etc.


Previous
Next