How Do I Use the Embed Code Tool?

The "Embed Code" tool allows you to include activities from different websites into your TeacherMade activity.  Many educational websites allow you to use their materials in a tool like TeacherMade. They often provide a "Share" or "Embed" button that will generate a snippet of HTML code that you can copy and paste into TeacherMade's "Embed Code" tool. The embedded page will appear in your TeacherMade activity.


Click this graphic to see one in action!


To use the "Embed Code" tool, you'll outline a rectangle where the activity will appear. Then you'll paste in the code for the activity.

  • Click and drag anywhere on your TeacherMade activity to define the area where you want the activity to be displayed.
  • Select "Embed Code" from the "Content Tools" column.
  • Paste the code given to you by the website into the "Embed Code' field.
  • Choose whether you want the activity to appear Inline or Floating:
    • Inline: the activity will appear within the rectangle you outlined.
    • Floating: a button will appear in the rectangle and students must click the button to view the embedded activity. The activity will open to the side of the TeacherMade materials. Students will be able to navigate through the TeacherMade activity while the embedded activity remains on the side.
    • If you choose "Floating" you will also have to enter a label for the button.
  • Click the eye icon to Preview your activity (this is always a good practice, but especially with "Embed Code" since you want to make sure the HTML snippet is correct.
    • If you see an URL in your rectangle, rather than the website content, then you've copied the wrong thing into the Embed Code object in TeacherMade. Typically, what you're embedding should begin with an "<iframe>" HTML tag. See if the website provides an "embed" button (which often looks like "</>"). If not, you might try the instructions for "Any website" below.


Every website will work a little differently. Here are instructions for embedding materials from some of well-known sites. If you'd like us to add one of your favorites, just send an email to support@teachermade.com and we'll look into it!


PhET

https://phet.colorado.edu/

There's nothing like hands-on simulations to help demonstrate important science concepts, and the folks at PhET have been making high-quality, instructionally valuable simualtions for years. To include a simulation from PhET in a TeacherMade activity, visit the page for the simulation, then click the "</>" icon underneath the simulation's title:


Click "Copy to clipboard" from the dialog box, then paste that into your Embed Code object in TeacherMade.


PhET simulations often begin with a small menu that allows students to choose between pages. If you only want to include a single page, just add "?pages=1" to the end (changing 1 to the page number you want students to see). The final result will look something like this:


Here's one we made to show you how it's done.


Desmos

https://www.desmos.com/

Desmos provides amazing math tools, including graphing calculators. You can create graphs and share them with your students by embedding them into TeacherMade.


To embed a Desmos resource, open the graph, then click the "Share" button in the upper right. When the drop down appears, click the "Embed" button.



Hit Ctrl-C to copy the "<iframe>" tag then paste it into your "Embed Code" object in TeacherMade. Don't hit the "Copy" button next to the URL or you'll only get the URL, not the full "<iframe>" tag.


Any Web Page

You can embed just about any web page into your TeacherMade activity. You'll need to copy the URL (e.g. https://www.google.com) and paste it into the following text where it currently reads "URL." Then change the "width" and "height" values to accommodate the web page's contents. Be sure to use TeacherMade's Preview feature to make sure everything displays correctly!


<iframe src="URL"
width="800"
height="600"
>
</iframe>


Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select atleast one of the reasons

Feedback sent

We appreciate your effort and will try to fix the article