Embedding media including slides, comic, quizzes, polls

Embedding media like slides, videos, comic strips, quizzes, polls into your blog posts takes your posts to the next level; providing opportunities for readers’ engagement and interaction in ways not achievable using plain text and images.

There’s a gazillion online tools nowadays. Most provide code that you can use to embed what you’ve found or created into your posts and pages.

Check out this list of popular web tools, used by educators and students, that can be embedded.

Using Embed Code

Adding embed code to posts or pages is as simple as:

1.   Completely write your post or page including adding title, text, images, tags and categories.

2.  Click on Save Draft, previewed your post and make all necessary edits.

 

3.  Click on Preview to previewed your post.

4.  Check your post and make all necessary edits.

5.  Locate the embed code for the media you created or want to embed.

• Websites use a range of different icons to represent Embed code.
• Look for icons like </>, the word Embed or hover your mouse over icons until you see the word Embed.

6.    Copy the embed code.

Here’s how to copy the embed code on Voicethreads

7.   Click on HTML Tab on post/page editor.

8.  Paste the embed code into your post where you want it to appear then click Publish.

• Don’t click back to Visual Tab before hitting Publish as it can break the embed code.
• Immediately close your post once you’ve published.
• Change back to Visual Editing mode when you write your next post or page by clicking on the Visual tab.
• You use this same process for any website that provides embed code.

9.  You should now see your embedded media when you view your Post on your blog!.

Important Embed Tips

1.  Embed code removed

If the embed code is removed when you click Save it means you are using a free Edublogs.org blog or you changed back to the Visual Editing mode before clicking on Publish.

To enable the use of almost any embed code in posts, pages and text widgets on your blog, and your student blogs, you need to upgrade your blog to Edublogs Pro or be using an Edublogs Campus blog.

2.  Use HTML editing mode

Remember never to click on the Visual Tab to change back to the visual editing mode once you have added the embed code.

This can break the embed code.   If this happens it can cause your blog sidebar to be pushed to the bottom of your theme or stop the embed from working poperly.

If you need to edit a  post or page that contains embed code make sure you change to HTML editing mode before opening up the post or page to edit.

The easiest way to do this is to:

1. Go to Posts > Add New or Page > Add New and click on the HTML tab.
2. Close the post while still in the HTML tab and then go to Posts > All Posts or Pages > All Pages to open the post or page for editing.

3.  Adjusting the embed size

Some embed code is designed to be embedded into normal websites and can be too wide for the width of your blog post.

Ideal width for embedding for most blog themes is 450 pixels wide.

If the online tool doesn’t provide the ability y to adjust the embed size you can often do this by editing the code yourself.   All you need to do is try adjusting the scale, width and/or height after you’ve added it to your post.