WordPress wiidget: WiiMenu

With this post I publish my second WordPress plugin called WiiMenu. Because this plugin is a widget, it needs the activated sidebar widgets plugin from Automattic, Inc or WordPress 2.2 or later to work.

So, what’s the story?

Recently I’ve used the Google Reader version for Wii. This was the first time I realized the possibility to react on wiimote button clicks on web sites. I found a button code reference and started developing this plugin.

It pops up a menu by pressing one specified button on the wiimote. This can be useful to help wii users navigating on your wordpress site. You can offer links, which are of special interest for wii users. Or you can just display your pages or categories to help wii users clicking on your links without the need of zooming, scrolling or simplifying your blog.

You want to have it? You’ll get it!

  1. If you use WordPress 2.0 or 2.1: Check the activation of your sidebar widgets plugin. If you don’t have it, you can download it here. Install and activate it before running WiiMenu.
  2. Download the WiiMenu wiidget.
  3. Extract the contents of the archive to this directory of your WordPress installation:
    /wp-content/plugins/widgets/. No other directory possible.
  4. Activate the WiiMenu widget in your WordPress admin.
  5. Customize the WiiMenu in the presentation area of your WordPress admin. You’ll get a detailed description below.
  6. You can customize the appearance of the menu by editing the wiimenu.css.

How to customize:

You can customize your WiiMenu in the presentation area of your WordPress admin.

First of all scroll down to the WiiMenu control, which looks like this:

You can define the title/headline of your WiiMenu and the wiimote button to activate the menu.
Additionally you can select the number of menu items for your WiiMenu.

Secondly you can build up your WiiMenu by dragging and dropping WiiMenu items or other widgets into the WiiMenu sidebar. This looks like this:

The special WiiMenu items can be customized by clicking on the item properties button to the right side of each item inside the sidebar. You can type in the title of the item and the corresponding url of the link. It looks like this:

Now you can save your sidebars and view your site on a Wii. Press your specified button on the wiimote and your own WiiMenu pops up. It could look like this:

WiiMenu on your site

You may ask: „How should wii users know that they can pop up an exclusive wii menu for my wonderful site?“. Yes, your right. That’s the reason, why I offer you a widget called „WiiMenu Sidebar Widget“. You can just drag it into your sidebar – not the WiiMenu sidebar of course – and all wii users will get informed how they can reach your wii menu. You can configure the text and the title. To show the configured access key, just place $1 somewhere into your text.

Styling your WiiMenu

Advanced users can edit the wiimenu.css inside the /wp-content/plugins/widgets/ directory of their WordPress sites to change the appearance of the WiiMenu. This is the css structure:

    • <h2> ‚ for the WiiMenu headline
      <ul class="wiimenu"> ‚ wrapping of all widgets.
      • <h2> ‚ the widget’s title
        <li id="wiimenu-item-1" class="wiimenuitem item1"> ‚ the widget’s wrapping. "1" is an iterator for each menu item. "wiimenu-item" is the id name of the widget.
        <div class="clear"> ‚ just for float control
  • <div id="wiimenu"> ‚ this is the WiiMenu box

WiiMenu using your language

WiiMenu supports the GNU gettext language translation system.
It would be great, if you could just send me (software at honma.de) your translation files, so everybody could take advantage of your work.

Enjoy

This is the first version of the plugin. If you have any questions or ideas concerning this plugin, just leave a comment on this post …
Have fun!

16.05.07: I’ve just updated the wiidget to make it compatible to the recently released WordPress 2.2. With WordPress 2.2 you don’t need to use the sidebar widgets plugin, because since that version the widget system is included into the core code of WordPress.