A full-screen image modal XBlock
A full-screen image modal XBlock, for use within the OpenEdX platform.
The full-screen image tool is another way of enabling participants to see more detail in your provided images. This tool is useful for large images with lots of details. A re-sized version of the image displays in the page, but clicking on the image pops open a full-screen modal with the full-size version of the image.
To install the XBlock on your platform, add the following to your requirements.txt file:
You’ll also need to add this to your INSTALLED_APPS:
To install the XBlock in your course, access your Advanced Module List:
Settings -> Advanced Settings -> Advanced Module List
and add the following:
To add a full-screen image to your course:
upload the image file onto your course’s Files & Uploads page
note: you can skip this step if you’ve already uploaded the image elsewhere, e.g.: S3.
copy the URL on that page
go to a unit in Studio
select “Image Modal XBlock” from the Advanced Components menu
You can now edit and preview the new component.
Using the Studio editor, you can edit the following fields:
thumbnail URL (defaults to image URL, if not specified)
description (useful for screen readers, longer descriptions)
alt text (useful for screen readers, captions, tags; displays when image does not)
Click on the image to zoom in full-screen.
Click on the image again to zoom out.
Click and drag to pan around.
Release history Release notifications | RSS feed
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.