INDEX:

Texts
Links
- Name Link
- CSS Classes
Media Embeds
- MONK (TL;DR the solving problems script)
- Files and Folders
- Images
  - Gdrive
- Podcasts
  - Soundcloud
- Videos
  - Youtube
  - Facebook
  - Twitter
  - Vimeo
- Surveys
  - Surveymonkey
  - Google Forms

Texts

Copy/Paste from Word to open edX

Copy the text from Word and paste it into https://word2cleanhtml.com/ double check the flags and hit convert to clean html
Click on Copy cleaned html to clipboard
On the backend (AKA Studio of open edx) https://studio.gchumanrights.org select Raw HTML as the content for the Unit
Click on EDIT to obtain the code window
Finally paste the sanitized code from clipboard and hit Save

Subtitles

IE [Hate Speech and Hate Crime]:

Code:

<p class="subtitle_page_programme">Hate Speech and Hate Crime </p>

Missing part and/or attention needed

Whenever you find some texts missing or some incomplete part it will be nice to use the appropriate class so it can be double checked easily

IE:

Code:

<p>
<span class="themissing">Freedom of expression on Internet: https://www.coe.int/en/web/human-rights-channel/-/free-expression-on-the-internet</span>
</p>

Article quotes and/or tables

IE:

Code:

<table border="1" cellspacing="0" cellpadding="0" class="table-articles">
    <tbody>
        <tr>
            <td width="100%" valign="top">
                <p>
                    <a name="_Hlk524902982">
                        Art. 17 Right to property
                    </a>
                </p>
                <p>
                    1. Everyone has the right to own, use, dispose of and
                    bequeath his or her lawfully acquired possessions. No one
                    may be deprived of his or her possessions, except in the
                    public interest and in the cases and under the conditions
                    provided for by law, subject to fair compensation being
                    paid in good time for their loss. The use of property may
                    be regulated by law in so far as is necessary for the
                    general interest.
                </p>
                <p>
                    2. Intellectual property shall be protected.
                </p>
            </td>
        </tr>
    </tbody>
</table>

The Title of the table is done with an anchor tag <pre class="default prettyprinted prettyprint"><a name=”putanamehere”>Art. 17 Right to property</a></pre>

Ordered/Unordered, Nested, Bold Lists

Ordered Lists

IE of ordered list

image_description

<ul class="number_list">
	<li>one</li>
	<li>two</li>
	<li>three</li>
</ul>

Alphabetical Lists

IE of alphabetical list

image_description

<ul class="letter_list">
	<li>one</li>
	<li>two</li>
	<li>three</li>
</ul>

Unordered Lists

IE of Unordered list

image_description

<ul class="lista_con_pallini">
	<li>one</li>
	<li>two</li>
	<li>three</li>
</ul>

Nested Lists

IE of Nested list

image_description

<ul class="lista_con_pallini">
    <li>List of Lists
        <ul class="lista_con_pallini">
            <li>Unsorted</li>
            <li>Unfortunate</li>
            <li>Unsorted</li>
            <li>Unfortunate</li>
        </ul>
    </li>
    <li>Unsorted</li>
    <li>Unfortunate</li>
</ul>

Bold Lists

IE of Bold and Nested Lists

image_description

<ul class="number_list_bold">
	<li>Trafficking needs an element of movement, but not a movement across
	        borders.</strong>
		<br><span>There are two important points here:</span><br>
		<ul class="lista_con_pallini">
		<li>
			<span>Does trafficking need movement? There is an evolving debate on the
			necessity of movement in the crime of trafficking. Recently there has been
			a move to conflate trafficking with slavery and forced labour (both of
			which do not need movement). Though the <em>Travaux Preparatories</em> for
			the Palermo Protocol (the official record of the negotiation during the
			drafting) note that the drafters saw an element of movement as compulsory
			for the definition, more recently the US government’s Trafficking in
			Person’s office and influential NGOs (such as Kevin Bales Free the
			Slaves and Anti-Slavery), all regard trafficking as a part of ‘modern
			day slavery.’
			<br>For details of this debate see: Janie A. Chuang. 2014. “Exploitation
		Creep and the Unmaking of Human Rights Law.” <em>American Journal of International Law</em> 108: 609-649.
			</span>
		</li>
		<li>
			<span>Trafficking within a country. Mostly media and counter trafficking
			represent trafficked victims as non citizens, as people who were taken
			across a border for exploitation. While this is the most common form of
			trafficking in Southeast Asia, there are trafficking pathways which are
			internal to a country. People are still trafficked from the countryside to
			the city, for example child domestic workers. Indigenous and minority
			groups are also vulnerable to internal trafficking. Another case is during
			disasters as there are concerns that people can be trafficked out of
			humanitarian camps.</span>
		 </li>
</ul>

Announcements Box

Colored Announcements boxes

Announcements boxes are useful when you want to make a bold announcement.

IE of Colored announcements boxes:

image_description

Code:

<style>
.announcements-box {
    padding: 20px;
    background-color: #f44336;
    color: white;
    transition: opacity 0.6s;
    margin-bottom: 15px;
    min-height: 50px;
    border-radius: 4px;
    font-size: 18px;
    vertical-align: center;
}

.closebtn {
    margin-left: 15px;
    color: fff;
    font-weight: bold;
    float: right;
    font-size: 22px;
    line-height: 20px;
    cursor: pointer;
    transition: 0.3s;
}

.closebtn: hover {
    color: #75716e;
}

.primary {
    background: #75716e;
}

.info {
    background-color: #009fe3;
}

.success {
    background: #15CD72;
}

.danger {
    background: #e6553d;
}

.warning {
    background: #f9bd00;
}

.muted {
    background: #ECECEC;
    color: #75716e;
}
</style>

<div class="announcements-box primary">
    <span class="closebtn" onclick="this.parentElement.style.display='none';">×</span>
    <strong>PRIMARY</strong><br><br>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ultricies quis arcu eget commodo. Etiam tempor lacus lorem, et ullamcorper odio interdum id. Morbi odio augue, porttitor eu posuere at, consequat eu augue. 
</div>
<p class="margin_bottom_20"></p>
<div class="announcements-box info">
    <span class="closebtn" onclick="this.parentElement.style.display='none';">×</span>
    <strong>INFO</strong><br><br>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ultricies quis arcu eget commodo. Etiam tempor lacus lorem, et ullamcorper odio interdum id. Morbi odio augue, porttitor eu posuere at, consequat eu augue. 
</div>
<p class="margin_bottom_20"></p>
<div class="announcements-box success">
    <span class="closebtn" onclick="this.parentElement.style.display='none';">×</span>
    <strong>SUCCESS</strong><br><br>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ultricies quis arcu eget commodo. Etiam tempor lacus lorem, et ullamcorper odio interdum id. Morbi odio augue, porttitor eu posuere at, consequat eu augue. 
</div>
<p class="margin_bottom_20"></p>
<div class="announcements-box warning">
    <span class="closebtn" onclick="this.parentElement.style.display='none';">×</span>
     <strong>WARNING</strong><br><br>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ultricies quis arcu eget commodo. Etiam tempor lacus lorem, et ullamcorper odio interdum id. Morbi odio augue, porttitor eu posuere at, consequat eu augue. 
</div>
<p class="margin_bottom_20"></p>
<div class="announcements-box danger">
    <span class="closebtn" onclick="this.parentElement.style.display='none';">×</span>
     <strong>DANGER</strong><br><br>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ultricies quis arcu eget commodo. Etiam tempor lacus lorem, et ullamcorper odio interdum id. Morbi odio augue, porttitor eu posuere at, consequat eu augue. 
</div>
<p class="margin_bottom_20"></p>
<div class="announcements-box muted">
    <span class="closebtn muted" onclick="this.parentElement.style.display='none';">×</span>
     <strong>MUTED</strong><br><br>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ultricies quis arcu eget commodo. Etiam tempor lacus lorem, et ullamcorper odio interdum id. Morbi odio augue, porttitor eu posuere at, consequat eu augue. 
</div>

FAQs for edX Courses

The working faqs

<style>
    .xblock .xblock h2 {
        font-weight: 300 !important;
        text-transform: initial;
        color: #75716e !important;
        font-size: 24px;
    }  
    .h2faq{
        font-size: 20px !important;
        font-weight: 300 !important;
        letter-spacing: 0px !important;
        line-height: 30px !important;
    }
    .h3faq{
        font-size: 16px !important;
        font-weight: 300 !important;
        letter-spacing: 0px !important;
        line-height: 22px !important;
        color: #646464 !important
    }
</style>  
<div class="mod_faqpage description_page_programme_no_border no_margin_bottom block">
        <article class="first even">
            <h2 class="h2faq">Enrolment</h2>

            <!--<section class="first even">
                <h3 class="h3faq" id="how-do-i-enrol-in-the-course-44aac414">How do I enrol in the course?</h3>

                <div class="ce_text block">
                    <p>In order to enrol, please follow the instructions on our “<a href="education/e-learning/moocs/monitoring-the-human-rights-of-lgbti-persons/how-to-enrol.html">How to enrol</a>” webpage . This will then lead you to the OpenEdX course page. Once you are there, you can start the enrolment process by clicking the "enrol" button.</p>
                </div>

                
            </section>-->

            <section class="last odd">
                <h3 class="h3faq" id="is-there-a-selection-procedure-to-participate-in-the-course-5a9b94ac">Is there a selection procedure to participate in the course?</h3>

                <div class="ce_text block">
                    <p>The course is a MOOC (Massive Open Online Course), which means we do not select participants on any basis. Rather, we welcome anyone who is interested in learning more about the topic to enrol and participate for free.</p>
                </div>

                
            </section>

           
        </article>
        
        <article class="odd">
            <h2 class="h2faq">Fees</h2>

            <section class="first even">
                <h3 class="h3faq" id="i-would-like-to-know-if-the-course-is-free-or-if-some-parts-are-to-be-paid-4b30d678">I would like to know if the course is free or if some parts are to be paid</h3>

                <div class="ce_text block">
                    <p>Our course is a MOOC (Massive Open Online Course), which means all components are open and totally free for anyone.</p>
                </div>

                
            </section>

            <section class="last odd">
                <h3 class="h3faq" id="i-would-like-to-know-if-the-course-is-free-or-if-some-parts-are-to-be-paid-148-27d18db9">Do I need to pay any fee to attend the course?</h3>

                <div class="ce_text block">
                    <p>There are no registration or tuition fees. </p>
                </div>

                
            </section>

           
        </article>
        

        <article class="odd">
            <h2 class="h2faq">Accessibility</h2>

            <section class="first last even">
                <h3 class="h3faq" id="is-the-course-accessible-to-persons-with-disabilities-c132662c">Is the course accessible to persons with disabilities?</h3>

                <div class="ce_text block">
                    <p class="margin_bottom_20">We want all participants in our courses to enjoy a great learning experience and we strive to always improve accessibility. Each week of the course includes one or two video lectures with accompanying transcripts and reading materials. The texts are in PDF format, work at low bandwidths, are printable and can be zoomed to the desired size. Some readings may include pages from accessible websites. This makes all of them accessible to those who use assistive technology software such as screen readers. Likewise, weekly discussions and module quizzes can be completed through our platform which is accessible, for example, to people who use speech input, keyboard accessible controls or text to speech tools. For more details please visit <a class="titolo_gc_europe" href="https://www.edx.org/accessibility">EdX Website Accessibility Policy</a> &nbsp;</p>
                </div>

                
            </section>

           
        </article>

        <article class="even">
            <h2 class="h2faq">Structure and content</h2>
            
            <section class="first last even">
                <h3 class="h3faq" id="is-there-a-schedule-for-the-course-or-is-it-self-directed-e2186c8d">Is there a schedule for the course?</h3>

                <div class="ce_text block">
                    <p>The course is self-paced so participants can study in their own time. However, in order to enhance peer learning, interactive participation and self-assessment, weekly topics and discussions as well as module quizzes are proposed at set dates. In any case, they are all open until the end of the course to facilitate access and completion at any preferred time. For a detailed description of the schedule check the <a href="https://gchumanrights.org/education/e-learning/moocs/fundamental-rights-of-the-european-union/course-outline.html" target="_blank">course outline page</a> on our website.</p>
                </div>

                
            </section>


            <section class="first last even">
                <h3 class="h3faq" id="is-there-a-schedule-for-the-course-or-is-it-self-directed-e2186c8d">I have a commitment in week 2. Would it be possible to work on it the following weeks?</h3>

                <div class="ce_text block">
                    <p>As the course is self-paced, the workload can be shifted from one week to the other. </p>
                    <!-- Even the quizzes can be taken in a one week span, so that every participant can adjust it to his/her personal commitments. -->
                </div>

                
            </section>
            <!--<section class="first last even">
                <h3 class="h3faq" id="is-there-a-schedule-for-the-course-or-is-it-self-directed-e2186c8d">How do I take part in discussions?</h3>

                <div class="ce_text block">
                    <p>Discussions are based on an initial question/prompt that refers to the content studied in a particular week and that usually gives you the opportunity to discuss, share examples, propose ideas, and interact with other participants. Participation in discussions is part of the learning process for all. Therefore, we trust each active participant will make meaningful contributions (so please note that a simple answer such as "I agree" will not be considered valid for the purpose of earning the certificate of participation). Due to the large number of participants, it might be difficult to follow all inputs, but you can easily search the discussion forum with keywords, names, issues, etc. Responses are also nested so that if you respond to another participant, you'll see the flow of your exchanges immediately below the initial input. At times it might be useful to create a group discussion if participants are particularly interested in further exchanges on a specific sub-issue. In such cases, the coordinating team will set up another discussion and interested participants will be able to join this one too.</p>
                </div>

                
            </section>
            <section class="first last even">
                <h3 class="h3faq" id="is-there-a-schedule-for-the-course-or-is-it-self-directed-e2186c8d">Quizzes</h3>

                <div class="ce_text block">
                    <p>Quizzes are foreseen at the end of each Module in order for you to check your understanding and progress. They are based on 5 questions and require a score of 4/5 to pass. They consist of different types of questions (true/false; yes/no; multiple choice; multiple answer) and once open, they remain available until the end of the course. You can have unlimited attempts and can see what answers you got wrong/right. However, for a more effective and satisfactory learning experience we warmly encourage you to take the quizzes after having prepared for them properly and not at random. 

</p>
                </div>

                
            </section>
            <section class="first last even">
                <h3 class="h3faq" id="is-there-a-schedule-for-the-course-or-is-it-self-directed-e2186c8d">What are the requirements to complete the course? </h3>

                <div class="ce_text block">
                    <p>To successfully complete the course students must take part in 4 weekly discussions and pass 3 quizzes.</p>
                </div>

                
            </section>-->


           
        </article>

        

        <article class="last even">
            <h2 class="h2faq">Certificate of participation</h2>

            <section class="first last even">
                <h3 class="h3faq" id="what-do-i-need-to-do-to-get-the-certificate-of-participation-c1ac8fc6">If I complete the Course will I get the Certificate?</h3>

                <div class="ce_text block">
                    <p>At the end of the course you will not receive a certificate of participation.

</p>

                    <p>&nbsp;</p>
                </div>

                
            </section>

           
        </article>
    </div>

Links&Span

Link Name

The A element defines an anchor.

You can create a link to a named anchor by using the name attribute (or the id attribute).

When linking within the same document, the A element is set as follows.


<a href="#Anchorname">linked text</a>

(Target point) 
<a name="Anchorname">a named anchor</a>

CSS Classes

Usually you would not use a class for the anchor tag, but it may happen that you want to use different color for specific regions:

<p><span class="titolo_gc_europe">EUROPE</span></p>
<p><span class="titolo_gc_south_east_europe">SOUTH EAST EUROPE</span></p>
<p><span class="titolo_gc_caucasus">CAUCASUS</span></p>
<p><span class="titolo_gc_africa">SOUTH AFRICA</span></p>
<p><span class="titolo_gc_asia_pacific">ASIA PACIFIC</span></p>
<p><span class="titolo_gc_latin_america">LATIN AMERICA</span></p>
<p><span class="titolo_gc_arab">ARAB WORLD</span></p>

Media Embeds

Usually you will have to embed different kind of media: Images, Videos, Podcasts and Files. Every hosting has it own set of rules, that can change in time so take these instructions with a grain of salt. The vade mecum will be updated regularly and will take changes into account: if you find some code not working please promptly report it ^_^

MONK (TL;DR the solving problems script)

Monk is a quick tool lets you easily paste a shareable link from gdrive and obtain the code to be used on open edX for:

Single File
Single File Landscape
Single Folder - Grid View
Single Folder - List View
Browseable Folder
Image

Upload your file to GDrive
Right click on the file from Gdrive and click on Get shareable link
Paste the shared link on https://gchumanrights.org/monk/monk.php
Choose the type of link you need and click on the SEND button
Click on the COPY button to get the markup needed on edX

Files & Folders

Single file

Upload your file to GDrive
Right click on the file from Gdrive and click on Get shareable link
Paste the shared link on notepad or wherever, it should look similar to this:

https://drive.google.com/open?id=1Axs4BGN3ywuYIrlHJ50K6O675CV5uqyN

Copy the highlighted part (whatever comes after id=) and check if the file orientation (portrait or landscape):

For portrait file you can use this code and replace the id (highlighted) with the one you’ve just copied

  <div class="box_vertical_a4_container">
      <iframe class="box_vertical_a4" src="https://drive.google.com/file/d/1Axs4BGN3ywuYIrlHJ50K6O675CV5uqyN/preview"></iframe>
 </div>

For landscape file you can use this code and replace the id (highlighted) with the one you’ve just copied

  <div class="box_horizontal_a4_container">
      <iframe class="box_horizontal_a4" src="https://drive.google.com/file/d/1Axs4BGN3ywuYIrlHJ50K6O675CV5uqyN/preview"></iframe>
 </div>

Results should look similar to those:

Single Folder

Create your folder on GDrive (it should contain at least two files otherwise check Single File)
Right click on the folder from Gdrive and click on Get shareable link
Paste the shared link on notepad or wherever, it should look similar to this:

https://drive.google.com/open?id=19Db85K2po9xydgMd4GsdiKL-1v7buMID

Copy the highlighted part (whatever comes after id=)):
- For grid view (when there’re few files) you can use this code and replace the id (highlighted) with the one you’ve just copied
```
  <iframe src="https://drive.google.com/embeddedfolderview?id=FOLDER-ID#grid" style="width:100%; height:600px; border:0;"></iframe>		
```
- For list view (when there’re many files) you can use this code and replace the id (highlighted) with the one you’ve just copied
```
  <iframe src="https://drive.google.com/embeddedfolderview?id=FOLDER-ID#list" style="width:100%; height:600px; border:0;"></iframe>
  
```
Results should look similar to those:

Multiple Browsable Folders

Create your folder with sub-folder(s) on GDrive
Right click on the folder from Gdrive and click on Get shareable link
Paste the shared link on notepad or wherever, it should look similar to this:

https://drive.google.com/open?id=1ZjrJK2kmBiLDZAHdt7AhZCFDMmFQWE5s

Copy the highlighted part (whatever comes after id=)

<div class="box_horizontal_a4_container">
     <iframe class="box_horizontal_a4" src="https://gchumanrights.org/edxtools/z_gdrive_viewer.php?ID=1aAABmOzQV9IVp_lTOkd42_Rl3bgHjpUL"></iframe>
 </div>

Result should look similar to this:

Images

Gdrive

Single file

Upload your file to GDrive
Right click on the file from Gdrive and click on Get shareable link
Paste the shared link on notepad or wherever, it should look similar to this:

https://drive.google.com/open?id=1L1aU8fWbn4ywFh1rX8M3Giu3oNn_FQkS

Copy the highlighted part (whatever comes after id=) and check if the file orientation (portrait or landscape): For portrait file you can use this code and replace the id (highlighted) with the one you’ve just copied
```
     <img src="https://drive.google.com/uc?export=view&id=1aAABmOzQV9IVp_lTOkd42_Rl3bgHjpUL" alt="image_description" />
 
```
Result should look similar to this:

Podcasts

Soundcloud

IE podcast to be embedded https://soundcloud.com/taleofus/caribou-cant-do-without-you-tale-of-us-mano-le-tough-remix

1. Click on Share button and then on Embed:

2. Copy the code for classic Embed [second option]

<iframe width="100%" height="166" scrolling="no" frameborder="no" allow="autoplay" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/166083001&color=%23ff5500&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&show_teaser=true"></iframe>

3. Paste the code on open edX:

<iframe width="100%" height="166" scrolling="no" frameborder="no" allow="autoplay" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/166083001&color=%23ff5500&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&show_teaser=true"></iframe>

Videos

YouTube

Youtube is the video providers for the online courses because of its deep integration with edX. To correctly post a video from youtube to edX you should have: URL of the video and it subtitles

How to get the subtitles

Login to youtube (username and password were delivered by email)
Go to this link [https://studio.youtube.com/channel/UC7xO-4Vs8EnTdwrUg3rSzug/videos/upload] (https://studio.youtube.com/channel/UC7xO-4Vs8EnTdwrUg3rSzug/videos/upload)
Click on the title of the video you want to embed
Click on the left menu Transcriptions
On the right side click on the English Automatic translation
On the new open window click on actions and select SRT
Download the subtitles and be ready to upload it to edX

How to get the Video URL

Login to youtube (username and password were delivered by email)
Go to this link [https://studio.youtube.com/channel/UC7xO-4Vs8EnTdwrUg3rSzug/videos/upload] (https://studio.youtube.com/channel/UC7xO-4Vs8EnTdwrUg3rSzug/videos/upload)
Click on the title of the video you want to embed
Click on the right side copy video URL

Embeding on edX

As the unit content select Video
Once the unit is loaded click on EDIT
While on the default edit tab please paste the youtube url
After that click on Upload New Transcript
Click on Save [Left bottom Corner]

Facebook

IE video to be embedded https://www.facebook.com/eiuc.venice/videos/1158241700993405/

1. Click on the 3 horizontal dots and select Embed: 2. Copy the code starting with <iframe …: it should be similar to this:

<iframe src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Feiuc.venice%2Fvideos%2F1158241700993405%2F&show_text=0&width=560"  width="560"height="315" style="border:none;overflow:hidden"scrolling="no" frameborder="0" allowTransparency="true" allowFullScreen="true"></iframe>

3. Code to be pasted in open edX [the only part to be kept out of the copied code is the highlighted src attribute]:

<div class="video169_container">
<iframe class="video169" src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Feiuc.venice%2Fvideos%2F1930785920278482%2F&show_text=0&width=560" frameborder="0" allowfullscreen=""></iframe>
</div>

Twitter

IE video to be embedded https://twitter.com/WhiteCodeCentre/status/1077442937884164096

1. Click on the chevron select Copy link to Tweet:

2. The URL should be similar to this:

https://twitter.com/WhiteCodeCentre/status/1077442937884164096

3. Code to be pasted in open edX [the only part to be kept out of the copied URL is the one highlighted (video ID) which has to be modified accordingly on the code below]:

<div class="video169_container">
<iframe class="video169" src="https://twitter.com/i/videos/1077442937884164096" frameborder="0" allowfullscreen=""></iframe>
</div>

Vimeo

IE video to be embedded https://vimeo.com/207085016

1. Click on the paper ariplane Share button: 2. Copy the code for Embed:

<iframe src="https://player.vimeo.com/video/207085016"</span> width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
<p><a href="https://vimeo.com/207085016">Global Campus Human Rights Journal - Viljoen</a> from <a href="https://vimeo.com/eiuc">EIUC - Global Campus</a> on <a href="https://vimeo.com">Vimeo</a>.</p>

3. Code to be pasted in open edX [the only part to be kept out of the copied URL is the one highlighted (video ID) which has to be modified accordingly on the code below]:

<div class="video169_container">
<iframe class="video169" src="https://player.vimeo.com/video/207085016" frameborder="0" allowfullscreen=""></iframe>
</div>

Surveys

SurveyMonkey

IE Survey to be embedded https://www.surveymonkey.com/r/NFL6PDT

1. Click on the paper ariplane Share button: 2. Click on Web Link 1 3. Click on Copy 4. Replace the highlighted src with the copied one

<p><iframe src="https://www.surveymonkey.com/r/T25DVBR" height="500px" width="100%"></iframe></p>

Google Forms

IE Survey to be embedded [https://forms.gle/rpdGz8UPiCvXcFJj9)

1. Click on the SEND button and the choose the embed icon: 2. Copy the Code on Embed HTML

3. Replace the highlighted src with the copied one

<p><iframe src="https://docs.google.com/forms/d/e/1FAIpQLSeLoABZkKjglKUydauNag9nv6bDx0RT7bXv-7AoWnrL1zQ2jA/viewform?embedded=true" width="100%" height="700" frameborder="0" marginheight="0" marginwidth="0"></iframe></p>

Vade Mecum open edX

This "vade mecum" is intended to be used a base for the course hosted on Global Campus open edX platform

INDEX:

Texts

Copy/Paste from Word to open edX

Subtitles

IE [Hate Speech and Hate Crime]:

Code:

Missing part and/or attention needed

IE:

Code:

Article quotes and/or tables

IE:

Code:

Ordered/Unordered, Nested, Bold Lists

Ordered Lists

IE of ordered list

Alphabetical Lists

IE of alphabetical list

Unordered Lists

IE of Unordered list

Nested Lists

IE of Nested list

Bold Lists

IE of Bold and Nested Lists

Announcements Box

Colored Announcements boxes

IE of Colored announcements boxes:

Code:

FAQs for edX Courses

The working faqs

Links&Span

Link Name

CSS Classes

Media Embeds

MONK (TL;DR the solving problems script)

Files & Folders

Single file

Single Folder

Multiple Browsable Folders

Images

Gdrive

Single file

Podcasts

Soundcloud

IE podcast to be embedded https://soundcloud.com/taleofus/caribou-cant-do-without-you-tale-of-us-mano-le-tough-remix

Videos

YouTube

How to get the subtitles

How to get the Video URL

Embeding on edX

Facebook

IE video to be embedded https://www.facebook.com/eiuc.venice/videos/1158241700993405/

Twitter

IE video to be embedded https://twitter.com/WhiteCodeCentre/status/1077442937884164096

Vimeo

IE video to be embedded https://vimeo.com/207085016

Surveys

SurveyMonkey

IE Survey to be embedded https://www.surveymonkey.com/r/NFL6PDT

Google Forms

IE Survey to be embedded [https://forms.gle/rpdGz8UPiCvXcFJj9)

23 Apr. 2020 - Initial Github release