Forum Discussion
Color Syntax Highlighter for Code Snippet
Hi all, I love the Code Snippet Feature as it allows learners to copy and paste the code. One thing that would be super helpful is if there was a way to show the colors syntax highlighter for readab...
This video @HighStrap shows a workaround, and this might solve the problem for some folks.
https://www.youtube.com/watch?v=AvcDNJX_hpE&t=30s
You can see how it looks like on Rise after the fix.
https://theme-360.com/theme-component/highlight-js-integration-for-rise-360/
I am still trying to do a iframe from Github...
Interesting.
If I understand correctly, it looks like the process would be:
- Create a course in Rise.
- Export the SCORM.
- Open the SCORM in your file manager and add the files for this extension.
- Make any edits to the HTML, CSS, and JS files in a code editor.
- Import the updated SCORM back into Rise.
Not sure that's scalable for my team's workflow, but interesting to know it's technically possible.
Yes, that's why it is a "workaround". :) I was playing with another approach which follows the steps below. Just share it here in case anyone is interested. The problem I tried to solve is not the syntax color highlight, but using some existing Jupyter notebook material if the SME already built them.
Using nbviewer
nbviewer is a web service that renders Jupyter Notebooks as static web pages.
1. Upload: Upload your notebook to a public repository like GitHub.
2. Get nbviewer URL: Visit the nbviewer website and enter the URL of your notebook.
3. Embed: Use the URL provided by nbviewer in your iframe.
Here is what it looks like in Rise. The embedded notebook reserved all the codes in their colors.
