7.1 KiB
Create interactive content in WordPress with the H5P plugin
Turn your WordPress site into an interactive learning management system
with this open source plugin.
WordPress is best known as a website content management system, but it also a great learning management system (LMS) for delivering online courses. If that is what you are looking for out of WordPress, then H5P should be the top plugin on your list.
H5P is a way to create and share interactive HTML5 content, including presentations, games, quizzes, forms, and more, in a browser. You can download a wide variety of content types from H5P's Examples and Downloads page, or you can create unique content to embed in your WordPress site.
H5P provides plugins and integrations for WordPress, Moodle, Drupal, Canvas, Brightspace, Blackboard, and more. In this article, I will show how to use H5P in WordPress to create a reading comprehension quiz for students.
Install the H5P plugin
The first step is to install the plugin. Log into your WordPress admin panel, go to Plugins, select Add New, and search for H5P in the Plugins field. When you find it, select Install Now.
(Don Watkins, CC BY-SA 4.0)
H5P should now appear in the list of installed plugins. Be sure to Activate the plugin by going to the H5P menu at the bottom of your WordPress admin panel and clicking the button. You will see the following display—be sure to consent so you can connect to the H5P Hub.
(Don Watkins, CC BY-SA 4.0)
Now you can begin adding H5P content to your WordPress installation.
Create a quiz
One of my favorite poems is Robert Frost's "The Road Not Taken." Suppose you are teaching a class that is studying this poem, and one of your objectives is for your students to remember the poem's author. First, create a new WordPress post on your site that contains the poem's text and its author.
(Don Watkins, CC BY-SA 4.0)
Now you want to test your students' comprehension with an HTML5 interactive content embedded below the poem.
In the WordPress admin panel, look near the bottom for the H5P Content menu and select it. In the menu that appears, click Add New.
(Don Watkins, CC BY-SA 4.0)
You will see an array of content options that are available. Since you want to create a multiple-choice quiz, look for the Multiple Choice option and click Get to its right.
(Don Watkins, CC BY-SA 4.0)
A form will open for you to start creating the quiz. Fill in the required fields (marked with a red asterisk)—give your quiz a title (e.g., "Road Not Taken Quiz"), enter a question (e.g., "Who wrote, 'The Road Not Taken'?") and correct and incorrect answers, and select the correct answer in the dialog box. When you finish creating the quiz, save the content.
(Don Watkins, CC BY-SA 4.0)
Embed the quiz in a post
Now you're ready to insert the quiz exactly where you want it to appear in your post. Open the post where you want to put the quiz (e.g., "The Road Not Taken" post) in your WordPress editor, and you should see an Add H5P button near the top of the interface. Place your cursor wherever you want the quiz to appear in the post, and click Add H5P. Your H5P content will appear in a dialog box like this:
(Don Watkins, CC BY-SA 4.0)
Select the content you want, and H5P will insert an embed code (e.g., [h5p id="1"]) in the post, like this:
(Don Watkins, CC BY-SA 4.0)
Save your post, then open it in your browser. The quiz is exactly where you wanted it to appear in the post:
(Don Watkins, CC BY-SA 4.0)
When a student answers this question correctly, they get pleasant visual feedback:
(Don Watkins, CC BY-SA 4.0)
The possibilities are endless
H5P offers a wide range of options to add interactivity to WordPress posts. In this example, you could have created a more complex set of multiple-choice questions. H5P also has lots of other content types, including interactive video, arithmetic quizzes, an audio recorder, image hotspots, fill-in-the-blank quizzes, and many more.
H5P also provides excellent documentation and great tutorials to help anyone who wants to use the plugin on their WordPress site. H5P software is open source under the MIT License with the code available on GitHub. H5P also welcomes contributions to the community; check out the developer guide for more information.
via: https://opensource.com/article/20/5/h5p-wordpress
作者：Don Watkins 选题：lujun9972 译者：译者ID 校对：校对者ID