Now that Matt has finally released a first version of liveTopics to the weblogging public, and is feverishly adding user requested features, the least I can do is demonstrate the use of some of liveTopics niftiest macros.

Today, I'll focus on liveTopicsHotButtons, which displays a list of topics used in your weblog, most frequent first.

To display the list in s l a m, all I had to do was opening the matching #homeTemplate.txt (in the www folder of Radio) with my favorite text editor and insert the following string inside the HTML code that defines the left side bar:

<%liveTopicsHotButtons( howMany:50, flDisplayInColumn:true )%>

The style in which the list is displayed in the page is defined by the "liveTopicsHotButtons" CSS class by default. So I entered the following definitions in the header section of the template:

<style type="text/css">
  .liveTopicsHotButtons {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
  }
  .liveTopicsHotButtons A:link {
    text-decoration: none;
    color: #606060;
  }
  .liveTopicsHotButtons A:visited {
    text-decoration: none;
    color: #606060;
  }
  .liveTopicsHotButtons A:active {
    text-decoration: none;
    color: black;
  }
  .liveTopicsHotButtons A:hover {
    text-decoration: none;
    color: white;
    background: #FF6600;
  }
</style>

The "howMany" parameter defines the number of topics displayed by liveTopicsHotButtons. 50 seems reasonable, but you can select any number best fitting your needs.

Setting "flDisplayInColumn" to true results in the topics being displayed in a stack, as they are on s l a m. Setting it to false creates a linear display.

"htmlEnclosure" is an optional parameter that defines the HTML element in which the topics list is encased. For a colum display, the default value of "div" is perfect, so I didn't include that parameter "slam"'s template. But for a linear display, I would probably have specified a "span" value for that parameter, or maybe just an empty string "" (no encasing html at all).

"htmlClass" is an optional parameter that defines the CSS class for the topics list. For "slam"'s home page, I chose to define the default "liveTopicsHotButtons" class in the template, so I could safely this parameter out.

"htmlId" defines the optional ID attribute for the HTML tag encasing the topics list. This is usefull when you have some W3C DOM compliant javascript code in your template that tries to grap the list and do something with its content. This is one of activeRenderer's basic tricks for instance.

Finally, "hrefClass" works exactly as "htmlClass", but only for the HTML links associated with each topic in the list.