I always thought a “marquee” was a sign that advertising an upcoming show in a theater, like the ones with the old-time light bulbs chasing around them. The Free Online Dictionary claims a marquee is a large open tent for performances. I had never heard that usage before.
In the web-based HTML world, a marquee was a text element where the text scrolled from left to right. The marquees were solidly condemned in the early days of them web, but are making a comeback, not as an HTML element, but as a design element within a number of pages.
Recently, a fellow consultant asked me to look at the issues involved with embedding a marquee within a WordPress page. Hence, this page, my sandbox. I wasn’t able to suggested a pre-built solution that met all of her requirements, but it gave me a chance to look at a couple of plugs I hadn’t worked with before. The first was WP-WebTicker, which uses a jQuery plugin to do the actual animation, but has a graceful degration of leaving the marquee items as a list (ordered or unordered) for those users or devices not running JavaScript. The invocation is simple from wordpress: a shortcode supports passing in parameter to specify: the number of items, the category of post titles to display, an id you can (and must!) use for CSS styling, the direction and the speed of the animation.
[webticker num=”10″ category=”82″ id=”webticker”, direction=”1″, speed=”0.03″]
A gotcha for me was trying to determine the ID number of the category, in my case, the “Ruby” category. Since I’ve enabled friendly names for display in most places, finding the key was tricky. Using the MySQL command-line tool, it only took a few minutes to find ‘term_id’ in the terms table. For those of you who don’t want to get to that level, here is a far better work-around.
Very cool. I really like the idea that you can filter the items displayed in the marquee to one or more categories. The other requirement of the original request was to allow the items to expire. So, posts for an upcoming event would stop displaying after the event or deadline had passed. I’d suggest the solution to that might be something like Post Expirator, though I haven’t tested this part of the solution. I like the idea you could create a ‘marquee’ category and then have the category of expired posts get automatically changed to ‘archived marquee’ posts, handy for reference.
[UPDATE] I noticed that the page is really CPU-intense. Floating the mouse over the jQuery Marquee drops CPU% from 32 to 5% on my machine. That’s a lot of horsepower being consumed scrolling the same old content. I’ll bet there are better techniques. Also note, the actual HTML marquee tag seems to have far less drag on CPU. If I were asked to implement this in an actual client situation, I’d certainly look at various options to relive the CPU burden, perhaps by loading an actual marquee tag dynamically, or looking at other effects (like sliding a long text field behind a viewport, like sliding barn doors) to see if there were a more CPU-efficient means of delivering the effect. Lower-powered or more heavily-burdened machines would certainly not render this as well.
The Silky-Smooth Marquee would also be a good jQuery plugin to evaluate.