Class Blogging Tips and Tricks: How to embed objects into your posts

Class Blogging Tips and Tricks: Embedding Objects

One of my major topics when I hold training sessions on blogging is how to embed certain objects into your blogs. These objects can be videos, Prezis, Scribd documents, etc. The procedure is very simple: Find the source of your object (YouTube, Vimeo, Prezi, etc.), look for the embedding code (which is always somewhere on the page) and paste it in your post (NOT in the composing area, but in the "Edit HTML" area). All seemed to go well until I noticed posts like this:

What happened here is that the object is too wide to fit into your posting area. Every blog has a posting area with a certain width. Before embedding an object, you should have an idea about approximately how wide your posting area is, so that you can avoid problems such as seen above. There are two ways to avoid this problem:

Solution #1: Adjust the width of your template:

Adjust width by moving slider

First go to Design==>Template Designer==>Adjust widths. Here you can adjust the width of your blog by moving the slider. You can also change the width of your sidebar. However, sometimes, the problem continues because in some templates the maximum width is still not enough to accommodate your videos. In this case, you have to get to the root of the problem, which brings us to the second solution:

Solution #2: Adjust the width of the video:

When objects (videos, Scribd documents, Prezis) are embedded into posts, their widths and heights are predetermined by the source site, such as Youtube or Prezi. In the past, the width and height information used to be only in the embed code (HTML code) but now you can determine these specifications before you copy the embed code.

Click "embed" in YouTube to see size options                     Change width manually in the code

After you click the "embed" button in Youtube, you will see that it offers a selection of sizes that you can choose from. When you click one, the code will automatically change. Previously, I had chosen a 640pxs width, which was too wide. This time, I will try 560pxs and see how that works out. It is a little game of trial and error to get the right width size number, but you have to do that  only once and then you can use the same number for all of your embedded objects. However, there might be sites where this option is not present. Then you will have to do this manually. After pasting the embed code into your post, just search for a line that has the word "width" in it. You will see that "width" is followed by a number just like the code in the YouTube example. Change the number to a size number that will fit your posting area and the size of your video will change.

Class Blogging Tips and Tricks: How to open link in a new window

The emergence of blogging services like Blogger and Wordpress has made blogging a very easy experience. A lot of teachers have started to blog in search of finding new ways to make students become more active in the language learning process. Teachers blog to share resources, videos, pictures and all kinds of information with their students and the rest of the world. All of this makes blogging a rich experience both for the teacher and the student.

With these posts, I want to share my solutions to little problems that our teachers have encountered during their blogging experience. I am sure that others out there had the same problems and are looking for ways to solve them. Well, here they are:

One recent problem that teachers encounter with their blogs is with Blogger's "link list" gadget. They use this gadget to provide students with useful links such as dictionaries, video sites, or grammar and vocabulary sites. However, their complaint is that whenever the students click the links, the sites open in the same window instead of opening in a new window. The same is valid for links that are given in a blog post. They, too, open in the same window instead of opening in a new one. Obviously, teachers want their students to continue reading their blogs while browsing dictionaries or other reference sites. Unfortunately, Blogger does not have a setting where you can enable such a feature. After extensively searching the internet, I have found the solution to both of the problems. Both can be solved by making little changes to the HTML code: