Forum Discussion
Setting Rise to open in new window
- 3 months ago
Hi NicolaAnderson- there does not appear to be an option for this within Articulate Rise. I checked the publish settings myself and could not find an option to do this, as you can in Storyline.
It would be possible to do this with a little bit of editing to the SCORM package after it has been published from the website.
You can try this by following these steps:
- Publish your content to SCORM
- Extract the contents of the zip file, it will look like this:
- Navigate into the folder named scormdriver and find the file named indexAPI.html.
- Rename indexAPI.html to riseAPI.html
- Download the zip file attached to this reply. Extract the contents, and copy and paste the HTML file into the scormdriver folder. The contents should now look like this:
- You now need to zip the entire package back up, ensuring that the zip file maintains the same structure. To do this, select all of the files in this view:
Right click the selected files, and then select the appropriate compression tool to zip the files back up. The key is that the file named imsmanifest.xml should be in the root of the zip file.
The updated package can now be delivered to the LMS. It will attempt to open a new window and will resize the window to fill the users screen. If it fails to open the window, it will display a message and a button to open the course. Here's a quick video demonstration (attached) of how to complete the above steps.
Create an HTML file with the following, and name it indexAPI.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Launch index.html</title> <script> function show(element) { document.getElementById(element).style.display = 'block'; } function hide(element) { document.getElementById(element).style.display = 'none'; } // Open Rise course function openFile() { hide('courseLoading'); const newWindow = window.open('riseAPI.html', '_blank', 'width=' + screen.width + ',height=' + screen.height); if (!newWindow || newWindow.closed || typeof newWindow.closed == 'undefined') { // If the window failed to open, display the button show('manualLaunch',); hide('courseOpen'); } else { show('courseOpen'); } } // Attempt to open the file when the page loads window.onload = function () { openFile(); } </script> <style> body { display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: 16pt; } #manualLaunch { display: none; padding: 10px 20px; font-size: 16px; cursor: pointer; } #courseOpen { display: none; } </style> </head> <body> <p id="courseLoading">Loading…</p> <p id="courseOpen">The course is open in a new window. To exit the course, close the course window.</p> <div id="manualLaunch"> <p>The course was unable to launch automatically. Select the START button to launch the course.</p> <button onclick="openFile()">START</button> </div> </body> </html>
Thank you so much Sam, you are an absolute legend! This worked perfectly and I have a very happy client :) Thank you for taking the time to create the file, do the video and provide such detailed instructions.