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.
thanks for sharing that Kayla, and SashaVodnik-857 depending on your setup you could actually host that css file yourself to make it more of a global include, so all courses load the same css file. Otherwise it would be a pain if you needed to change a color value across all courses. I don't like creating external dependencies like this, but depending on your LMS setup you could point to a file that resides in your LMS/server so its not really an 'external' file.
