I am working on the curriculum design and development of a Malaysia MOOC that is funded by the European Union under the COMPETEN-SEA project. This capacity building project for Malaysia MOOC is focused on up-skilling and empowering single mothers with entrepreneurial knowledge and know-hows. It’s a project-based MOOC involving a committed and multi-talented team in diverse fields. Educators, researchers and scientists in computer sciences, social sciences, economics, business, neurosciences, industrial technology and pharmacy(!). Not to mention, the academicians come from different countries and backgrounds–Germany, Holland, Spain, the Philippines, Indonesia and Malaysia. Very interesting crowd indeed as captured in a recent tweet below:
The #CompetenSEA consortium is already in preparation for #koningsdag during our successful consortium meeting in Delft. pic.twitter.com/eNlRR6nBxg
— Maren Scheffel (@m_a_s_c) April 23, 2018
To train our Subject Matter Experts (SMEs), I prepared some short video tutorials. These were uploaded to youtube and compiled as a playlist. Our SMEs can watch these videos and start using the Open edX platform as the project progresses. So then, I wanted to embed a playlist into our edX MOOC course.
iFrame Tool in Open edX
To embed a youtube playlist, one can use ‘iFrame Tool’ in the Open edX platform. See below. The instruction was too long… ?
I attempted 6-7 times on my own–changing the given codes in multiple ways–before I went on searching for video tutorials on the youtube. Open edX suggests checking out this site on iFrame. It’s Greek to me. Another hour spent with no success. I’m no coder. I almost give up… Why spend my Friday afternoon doing this? Why oh why?… thoughts came…
Well, that’s when the magic happens (I guess).
It took me a few minutes (less than 2 minutes actually!) to embed a youtube playlist. Since there is no tutorial for non-coders using the Open edX platform, I decided to share the how-to.
The HTML iFrame code is as follows:
<iframe title-“Ask Dr Aisyah” width=”560″ height=”315″ src=”https://www.youtube.com/embed/videoseries?list=PL1GqUlw4lwiWx37HYsIKxPdkNGsLQfBX2″ frameborder=”0″ allow=”autoplay; encrypted-media” allowfullscreen></iframe>
Just copy paste the code above for your edX course. Add your title. Add your own youtube playlist link.
The short video tutorial below shows really easy step-by-step how you can use the code to insert an iframe into an edX course page. I also show you how to adjust the width, and height in the iframe code: