How to format your Rise 360 course for Arabic
UPDATE: EVEN EASIER. DOWNLOAD THE ATTACHED ZIP FILE AND PASTE THE 4 FILES ENCLOSED WITHIN INTO THE "LIB" FOLDER (OVERWRITE OLD FILES)
Hey all. I work for a college here in Qatar and wanted to share my experience of how to overcome the limitation of right to left (RTL) languages (specifically Arabic) and show you my workaround in the hopes that someone may benefit from it.
Unfortunately it does require you to be a bit tech savvy and will not work if your audience is viewing your course directly through Rise 360. In our case, we are using Blackboard Learn and if you export the course before making it available to your audience then this "hack" might work for you.
The idea is to fix the problem through code. We can't modify the code directly within rise so this has to be done in between the authoring and publishing phase when we export the course. If you export to LMS, you will most likely get a zip file.
Extract the zip file so you can see its contents and modify a file called index.html
open up notepad on windows or TextEdit on Mac > File > Open
Navigate to the extracted course and go into these folders
Your Course Name > scormcontent > index.html
Once you open it with the text editor, you will see some scary code. Dont worry, you dont need to understand it, but you do need to observe a few elements.
Right at the top of the file (2nd line i guess), you will see:
<html lang="en" class="">Replace this whole line with
<html lang="ar" dir="ltr" class="">
Not so hard right?
Now just below that line is a code that is <head>, just below it, paste the following:
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha256-4+XzXVhsDmqanXGHaHvgh1gMQKX40OUvDEBTu8JcmNs=" crossorigin="anonymous"></script>
You are doing well, now the last bit of code. Just below that, paste the following chunk of code.
<script type = "text/javascript">
var arabicFix = function(){
$('p,h1,h2,h3,h4,h5,li,ol,ul,strong,a,span,.brand--ui,.lesson-header__top-wrap,.page-header-container,.overview-sidebar__title,.fr-view').attr('dir','rtl').attr('align','right');
$('blocks-tabs__container').children().attr('dir','rtl').attr('align','right');
$('.block-flashcards-slider__progress-text').attr('dir','ltr').attr('align','center');
}
setInterval(arabicFix,500);
</script>
Save to overwrite the default index.html file. Test it out by launching index.html in your browser.
To repack the file properly, navigate to the folder where "scormcontent" is, select all the files and zip them using your zip application (I use 7-Zip on windows and Archiver on Mac).
Your course is now ready for Arabic including layout of bullets, accordions, tabs, carousels etc. Drop me a line if you need help, id be more than happy to walk you through any stage of the process.
Have a lovely day!
