How to embed content from external Websites?
WHAT IS IFRAME?
An iFrame is a frame within a frame. It is a component of an HTML element that allows you to embed documents, videos, and interactive media within a page. By doing this, you can display a secondary webpage on your main page.
WHEN TO USE IFRAME?
-When you want the learners to access content from third-party websites without redirecting the users away from your teaching platforming.
-When you want to embed(soft-integrations) simulations, virtual labs, code-editors etc.
-When you want to embed Google docs (EXCEL, WORD, SLIDES etc**)**
You can take the help of this VIDEO to use the iframe block.
Follow the steps for using the iFrame block:
STEP 1:
Firstly you will need to click on the ‘ADD NEW BLOCK’ tab inside the classroom.
STEP 2:
In this step, please search ‘IFRAME’ from the search bar and click on that.
STEP 3:
Please give a suitable TITLE and add the URL for embedding. In this example, we have taken a simulation from PHET. You can use the URL below to test the iframe embed:
https://phet.colorado.edu/sims/html/balancing-act/latest/balancing-act_en.html
STEP 4:
Now in this step, please adjust PIXELS and FRAME BORDER as per the requirement.
STEP 5:
Please click on the ‘UPDATE' and then click on SAVE’
STEP 6:
Next in this step, you will need to click on the ‘VISIT YOUR SITE’ tab to view embedded iFRAME as a learner or you can also log in with learner credentials.
STEP 7:
In this step, please click on the ‘RESUME’ tab**.**
STEP 8:
Now please click on the ‘START’ tab to see the iFRAME
From the learner's side, you can now view the iFRAME.
CONGRATS !! You have successfully added IFRAME to your learning course. Now you can start embedding IFRAME and your learners can play around with this learning style to learn more concepts.
An iFrame is a frame within a frame. It is a component of an HTML element that allows you to embed documents, videos, and interactive media within a page. By doing this, you can display a secondary webpage on your main page.
WHEN TO USE IFRAME?
-When you want the learners to access content from third-party websites without redirecting the users away from your teaching platforming.
-When you want to embed(soft-integrations) simulations, virtual labs, code-editors etc.
-When you want to embed Google docs (EXCEL, WORD, SLIDES etc**)**
You can take the help of this VIDEO to use the iframe block.
Follow the steps for using the iFrame block:
STEP 1:
Firstly you will need to click on the ‘ADD NEW BLOCK’ tab inside the classroom.
STEP 2:
In this step, please search ‘IFRAME’ from the search bar and click on that.
STEP 3:
Please give a suitable TITLE and add the URL for embedding. In this example, we have taken a simulation from PHET. You can use the URL below to test the iframe embed:
https://phet.colorado.edu/sims/html/balancing-act/latest/balancing-act_en.html
STEP 4:
Now in this step, please adjust PIXELS and FRAME BORDER as per the requirement.
STEP 5:
Please click on the ‘UPDATE' and then click on SAVE’
STEP 6:
Next in this step, you will need to click on the ‘VISIT YOUR SITE’ tab to view embedded iFRAME as a learner or you can also log in with learner credentials.
STEP 7:
In this step, please click on the ‘RESUME’ tab**.**
STEP 8:
Now please click on the ‘START’ tab to see the iFRAME
From the learner's side, you can now view the iFRAME.
CONGRATS !! You have successfully added IFRAME to your learning course. Now you can start embedding IFRAME and your learners can play around with this learning style to learn more concepts.
Updated on: 23/06/2021
Thank you!