Web Design

TeachMeet Kentucky: Tagul

TeachMeet Kentucky: Tagul

If you’ve seen word clouds like Wordle, you will love Tagul. It is designed to make gorgeous, interactive word clouds. Paste text or a ULR into Tagul, and it makes a dynamic word cloud. Embed the could on a website, and the words are clickable and searchable. Here is an example:

Get Adobe Flash player


You can customize the fonts, cloud shape, and colors. You can even customize the search source–a Google search is default when they click on a word, but you can have the search on your website when they click on a word. This is excellent for websites you’ve created that are full of resources. When a student click on a word in your Tagul, it searches your website and displays relevant posts and pages.

Here are my notes from my TeachMeet presentation in Kentucky on Tagul:


View more presentations from Bill.

Here’s the workflow for using Tagul:

1. Sign up

You need an account to create a Tagul. You are able to create up to 20 clouds (recently increased from ten!).

2. Paste information

You can paste text or a URL to generate the cloud. URLs are great for displaying hierarchical ideas because Tagul makes more frequent words bigger in the could. Pasted text could be useful if you are studying a book or article. Important words will pop out, and students will immediately see the big ideas from the text.

3. Customize

You can eliminate frequent or unimportant words (like: the, as, I, we, so, etc.). Customize fonts, shapes, and colors to match your website or the mood of the text.

4. Preview

Click Generate Cloud to see a preview. Every time you click this, a unique cloud is created. If you don’t like the look, either click Generate again or go back and modify the cloud.

5. Embed

Be sure to click save to keep your updates. Tagul gives you embed code that you can paste into your website or blog.



Integrate into the Classroom

  • analyze text
  • introduce a new book
  • home page of teacher website/blog
Say no to sidebars! (customize your WordPress pages)

custom drink

Typically, I blog about educational technology that the average teacher can understand. This, however, is some heavy lifting.

Here is an advanced trick for WordPress users. This is how I removed the sidebar from one specific page (titled forum) on my wordpress site. After much searching, I found that I needed to implement conditional formatting using php.

Here’s my problem:
I wanted one single wordpress page to not have a sidebar. I wanted it to take up the entire width of the page. Makes sense for a forum, right? Not so easy…

In the wordpress dashboard, navigate to Appearance > Editor > page.php.
On page.php, I changed:

[sourcecode language=”plain” light=”true”]<?php get_sidebar();; ?>[/sourcecode]


[sourcecode language=”plain” light=”true”]<?php if(!is_page(‘Forum’)) get_sidebar();; ?>[/sourcecode]

Here’s what that means:
Typically, wp displays the sidebar. That’s what we usually want. In this case, the exclamation point means “if it is not”. So, the php translation is, “If it’s not the Forum page, then show the sidebar.”

Perfect, so far. However, there was a blank space where the sidebar used to be. Another problem. The forum should be wider. This won’t happen, though, because my stylesheet says the page can only be 510 pixels wide.

So, I went to my stylesheet and created a div titled #widecolumn with a width of 100%.

Back on page.php, I changed the original div titled #contentleft to:

[sourcecode language=”plain”]<?php if(!is_page(‘Forum’)) { ?>
<div id="contentleft">
<?php } else { ?>
<div id="widecolumn">
<?php } ?>[/sourcecode]

Again, with the php translation: “If it’s not the Forum page, use the div #contentleft (with a width of 510 px). If it is the Forum page, use the #widecolumn div that you just made (with a width of 100%).