GeoGebra Advanced Tutorial 2 – Embedding GeoGebra Applets in Blogger/Blogspot

In the last advanced tutorial, we have learned how to export a GeoGebra worksheet to a Dynamic HTML. As we have observed, the GeoGebra worksheet is exported as a single page; therefore, we have very little control over it, unless, of course, we know how to code HTML or CSS. This also means that if we link the dynamic HTML to our blog or webpage, we will have to go to a new page to view it.

There are instances, however, that we do not want to open a new page; that is, we want to embed our GeoGebra applet in our web page or blog post. To do this, we will extract the GeoGebra HTML code (contains Javascript) and paste it in our blog post or web page.

In this tutorial, we will use Blogger as a sample blog to embed a worksheet since Blogger allows Javascript embedding. Note that there are websites or applications that do not allow Javascript embedding, so you have to consult with your technical support, in case your GeoGebra worksheet didn’t show up after you embedded it.

Instructions in Embedding

In this post, we will assume that you have already a GeoGebra worksheet to embed. If you just want to follow this tutorial, and you do not have a GeoGebra worksheet, you can download a sample GeoGebra worksheet here and follow the instructions below.

Steps in Embedding GeoGebra to a Blogger/Blogspot Post

  1. Open your GeoGebra file.
  2. Resize the GeoGebra window so that it will fit the place where you will embed it. Note that the size of the GeoGebra window in a GeoGebra worksheet will also be the size of the applet after embedding.
  3. Select File>Export>Dynamic Worksheet as Webpage(html) from the menu bar to display the Export dialog box.
  4. In the Export dialog box , select the Advanced tab, and then select Clipboard: HTML from the Files section.
  5. Click the Clipboard button to copy the HTML code.
  6. Next, open your blogger post where you want to embed the GeoGebra worksheet
  7. Select the Edit HTML tab, and then paste the HTML code by clicking Paste from the Edit menu (or pressing Ctrl-V).
  8. Remove all the HTML codes before the <applet name=…> text and all the code after the </applet> text.
  9. Select the Compose tab to preview your GeoGebra worksheet.
  10. Add instructions/questions outside the <applet>…</applet> block.
  11. Click Publish Post to publish your blog.

There you have it. You have embedded your GeoGebra applet.

Related Posts Plugin for WordPress, Blogger...

12 thoughts on “GeoGebra Advanced Tutorial 2 – Embedding GeoGebra Applets in Blogger/Blogspot

  1. I am facing problem embeding geogebra files (GGB) into my blog (Blogger). I am following above steps explained by you. I don;t know what is the problem I am getting “error message”

Leave a Reply