Adding A Voki Speaking Avatar To A Post or Page of Your Blog

Voki add a “human element” to your blog — readers can now hear your voice.

There are two ways a Voki can be added blogs:

  1. Using a text widget in your blog sidebar – when you always want the Voki to appear on your frontpage
  2. By embedding them in a Post or Page – when using the voki for giving instructions to students or displaying student created Vokis

Here’s instructions on how to add a voki to your blog sidebar.

This post explains how to embed vokis in Pages and Posts (check out these ideas on using Vokis in your classroom).

Embedding a Voki in Post or Page

Voki’s as embed in Posts and Pages as follows:

1.  Go to Voki

2.  Set up a Voki account and then create your own Voki.

3.  Once you have published your Voki grab the HTML embed code as follows:

a) From drop down menu next to ‘Embed in’ select WordPress

Selecting the destination for a Voki

b) From drop down menu next to ‘Size’ select Large (300 x 400)

Changing embed size of Voki

c) Click Get Code and copy all the HTML embed code

Tip: Fastest way is to use the ShortCut Keys Ctrl+A to select all text and Ctrl+C to copy the text

Copying the Voki HTML embed code

4. Go to Posts > Add New in your blog dashboard

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

6.  Click on HTML Tab


7.  Paste the embed code for the  Voki 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 by clicking on the Visual tab.
Adding a voki to a page or post

Adding a voki to a page or post

Please note

Voki avatars embedded in posts are stripped out by feed readers like Google Reader.

It’s good practice to let your readers know that you’ve added a voki to a post and include a link to its original location

  • he location of your Vokis is enclosed by quotes after src= is the URL address of your voki in your embed code

For example you might say:

If my voki has been removed by your feed reader, you can check it out here.



Get a Voki now!

FINAL THOUGHT

We hope you enjoy creating your voki avatars and adding them to your blogs. Please let us know how you go.

If you are enjoying reading this blog, please consider Subscribing For Free!

Sue Waters

Edublogs Support Manager @suewaters on Twitter

64 Responses

  1. wvskphillips says:

    Wonderful addition to add some character to my blog! Thanks for the resource. I can see some really cool uses for this. Thanks again! PS – the directions were extremely easy to follow – well done.

  2. Randy Gibson says:

    Sue,

    I believe that in Step 4 of your instructions for “Adding A Voki Speaking Avatar To A Post or Page of Your Blog”, you intended to write “… enclosed in the quotes… ” rather than “… enclosed in the commas …”.

    I just thought that you would like to know.

    Randy Gibson, Computer Science Department
    Indian River Community College – Fort Pierce, Florida

  3. Sue Waters says:

    Hi Sonja (wvskphillips) – just dropped past your blog and congratulations for creating and adding a voki to a post. Well done — glad the instructions helped.

    Thanks Randy -definitely was a mistake and I do appreciate you letting me know. I’ve changed the wording now. I wrote these two posts on Voki at the same time so when I got to this post I was a bit tired – hence the reason for the grammatical error.

  4. spam check89

    Sheesh…..bling bling. Where and when did you get into Copyright The Edublogger ?

    What happened to the CC 3.0 ethic of 6 months ago ?

  5. Wow!

    also, can you add a Voki as a user advatar? or even a blog advatar?

  6. I love these and had my 13 year-old French class create vokis for a range of teachers from our school (with their permission). My blog now has a virtaul staffroom populated by French-speaking virtual teachers. They loved it (students and the staff).

  7. Sue Waters says:

    Hi Alex – the “This post may be Copyright © 2008 Sue Waters. Hosted by Edublogs” has been added to every Eublog – obviously not my name — because there had been some issue with others using people’s posts without permission. My recommendation if people have concerns with the wording they add their own license to their blog sidebar or to each post.

    Sorry StarDuckPiano – blog and user avatars can 0nly be jpeg, gif, and png files.

    Hi Gail – that sounds like it was a fun activity for both your teachers and students. I did try searching for them on your site but had no luck. Any chance of the URL so I can check them out?

  8. Annie says:

    This was so much fun. I love reading your blog and depend on it for lots of insights. In fact, I’m going to add you to my blogroll. If you get a chance, drop by http://www.crazy4kidsbooks.blogspot.com and check out my new Voki.

  9. I have successfully added Voki’s to my posts and sidebars, but the Voki site does not seem to save my Voki’s for future use or editing. Is this everyone’s experience or am I doing something wrong?

  10. Also, when I showed her the Voki’s a colleague suggested using Blabberize.com to create talking photos. I haven’t tried it yet, but it seems like it would work and be fun!

  11. Sue Waters says:

    HiAnnie – your voki looks so pretty I must admit I’m feeling a bit jealous as I made mine in a hurry.

    Ellen – I was retesting voki yesterday and it was giving me attitude. Wouldn’t give me the code of my saved voki. Perhaps they are having trouble with the site. Blabberize is good. You may also want to check out Larry Ferlazzo’s list of best site for practicing English.

  12. Another question:

    Can you have a .gif animation as an advatar? of you can’t, can you try to add that as a new feature to an update to Edublogs?

  13. Sven says:

    Hi, just discovered this really interesting blog, I will surely visit it again.
    On Voki’s: I have to be the one where it doesn’t work. The problem is that I can not find such an ‘embed flash button’ in the WordPress toolbar. Now, I know, WordPress has changed its layout, but I don’t remember having seen this button before.
    So, it doesn’t work for me to put a Voki on my blog. Anyone any thoughts?
    Thanks,
    SveN

  14. fuadhawmd says:

    hi 4 all
    the subj. w’ll disc. is the cell

  15. Debbie Thom says:

    Hi there I did everything you instructed me to do about adding a voki to my blog but it didn’t work. All I got was the link to the voki website. It didn’t seem to want to save the code. Any ideas why this is?

    • martinteach says:

      Hi Debbie,

      I had the same problem. Did you ever find out what works?

      I’m still playing with my site and having done anything to it yet.

      Thanks.

      martinteach

      • Sue Waters says:

        @martinteach will depend on what blogging platform you are using.

        Edublogs is powered by WordPress MU but we have made changes to the code so that it allows almost any embed HTML code. This is why Voki, Google Reader etc can be embedded into posts, pages and sidebars.

        You can’t embed many of these types of objects into WordPress.com and if you are using a standard WordPress MU you can’t either because they have a system set up that strips out the embed code they don’t allow.

  16. Mr Meikle says:

    I don’t seem to have the flash icon. Can you think of a reason for this?

  17. Sue Waters says:

    Starduckpiano,

    Sorry .gif animation as an avatar isn’t possible at the moment and not sure if it will be an option.

    Sven,

    Sorry not sure what embed code restrictions they have on WordPress but I would try embedding directly using the Code Tab.

    Debbie

    Sorry I wasn’t able to help you with this due to the restrictions on your blog platform.

    Sorry Mr Meikle

    There has been changes within the blog dashboard so there is no flash icon. I haven’t had time to update this post. If you read this post it explains how to embed flash and vokis.

  18. I don’t know what I am doing wrong : ( I have the code from voki, but I need to know how to embed it as part of the sidebar 1 of my blog. I tried adding a widget, but it won’t let me add the code. I tried adding it to a posting that I have previously made and it didn’t work.

    Any suggestions will be appreciated as I become familiar with edublog.

  19. alexisalexander says:

    I also have been only getting the code, even though I am pasting the voki in in Code view. I had a voki in there and working before, but since the flash button has disapeared I have not been able to do it.

  20. Sue Waters says:

    I’ve just updated this post to show how you embed Voki avatars into pages and posts using our latest version of Edublogs. If you embedded into a page or post using the old method (i.e. the Flash Button) you need to re-embed your voki using this method.

  21. Ashley Proud says:

    Voki’s rock

    My kids love them

  22. missvandenhove says:

    Hello!
    How many voki can you use on one post/page?
    Voki does not seem to offer a Worpress option (standard web page, Blogger, Myspace, javascript or other). Which one should I choose?
    Thank you for your help.
    H

  23. Sue Waters says:

    @Missvandenhove I’ve seen people add more than one Voki to a page. Standard web page works fine. The key is to click on HTML TAB add embed code then immediately press Publish (don’t click back to Visual Tab). If you re-edit the post you may need to re-add the embed code.

  24. Jo-Anne says:

    I tried to follow your directions for putting a voki avatar on my WordPresss Blog but I am not given a “wordpress” option when I select a destination. Any ideas?

  25. Sue Waters says:

    @Jo-Anne Just choose Standard Web Page. However my understanding is that WordPress.com has tighter restrictions on embed codes than Edublogs so if it doesn’t work when you try to embed that is the reason.

  26. Hi – Like the information, BUT when I try to get my code for my voki, there is no choice for WordPress, just ‘blog’ ‘standard web page’ etc. Am I in the wrong place? wrong Voki account . . .?

    Any help would be appreciated, thanks.

  27. upon further investigation… i read the other comments and you have already answered this question from another…”thanks” (he says embarrased).

  28. e028668 says:

    This didn’t work for me. All I see is a broken image holder where the voki should be. Any help? What did I do wrong?

    http://lvepolk.edublogs.org/

  29. e028668 says:

    I tried to put my voki on my blog post but all I see is a missing image box. Any ideas on what I did wrong?

    http://lvepolk.edublogs.org/

  30. phillipstw says:

    Need to know how to embed my voki into a flipchart on promethean board?
    Any suggestions?
    TC

  31. dbturner says:

    I use Vokis in my course management system to introduce units and help students focus on specific ideas. Students like them. AND I put pictures from around campus as the background to make it more local and interesting.

    • Sue Waters says:

      @phillipstw Sorry I don’t have any ideas on embedding into a Flipchart or if it is possible. Worth locating a blogger who writes about Smart Boars and asking them.

      @dbturner, That is a cool way of using the Vokis. I don’t suppose you could share a link to a Voki that includes images from your Campus?

      • dbturner says:

        @Sue Waters, Since it is in our CMS, it is only accessible for students, but i will send you a link to the original and you can show it if possible. (will that work?)

  32. monica says:

    Hi,

    I’ve made a voki, then I try to get a code,but when I’ve to choose a destination (Embebed in), I don’t have any option to choose. Can you help me?

  33. Sue Waters says:

    @monica Voki has been making changes to their website and looks like there is an issue with this. I’ll send through an email to see if they can check into it.

  34. Sue Waters says:

    @monica Just letting you know that I contacted Voki and there was a problem. They have now fixed it.

  35. Effie says:

    Hi,
    I want to post a voki in the sidebar. I copied the code into a text widget but it just doesn’t work or at least I can’t see it with google chrome or explorer. Any ideas why?

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Follow

Follow this blog

Get every new post delivered right to your inbox.