A WordPress theme for Ubuntu community teams

Quite some time ago I sat down with Timo Jyrinki, a Canonical employee but more importantly, a Ubuntu community member who is involved with the local community team here in Finland. During the time we spent at the café we talked about a need to refresh the website for the Finnish LoCo team.

Relatively shortly after that we landed a few quick patches for the website to fix the most obvious problems with Timo and Jiri Grönroos. After having done this, we all knew that the patches would only be more or less temporary, so I started working on a theme that the team could use.

While the original intention was to get a theme that would be a replacement for the current Finnish community teams website, it became apparent to me that other teams would likely prefer a new theme as well. Having figured this out, I kept flexibility and customizability in mind.

A few years after the first discussion about the theme, I’m happy to announce that the first public release of the Ubuntu community teams WordPress theme is out (for a while already).

What does it look like?

Well, it looks quite a bit like the Ubuntu website.

Ubuntu community teams WordPress theme

Of course, being a theme for a large community, you can customize it to look more to your liking, without having to worry about anything breaking.

Ubuntu community teams WordPress theme (customized)

Ready to go?

If your site is managed by the Canonical IS, ask them to enable the Ubuntu community WordPress theme for you – for clarity, you can link them to The Launchpad project ubuntu-community-wordpress-theme. They have agreed to maintain the theme centrally, so you will always get all updates and fixes to the theme as soon as they are released (and the changes have gone through their review).

If you manage your site yourself, you can get the code either from the Launchpad project mentioned above, or the Github source for ubuntu-community-wordpress-theme. The instructions on how to set up the theme can be found on the README.

Either way you will be using the theme, some pointers on getting the most out of the theme can be found on the README.

Any questions?

If you have any questions, feedback or even feature requests, be in touch. I will happily help you with setting up the theme and making the Ubuntu community sites more beautiful.

Clock applets in the Xfce panel in Xubuntu 15.10

Both Xfce and Xubuntu have had new releases relatively lately. In a way or another, this has resulted in an issue with Xubuntu 15.10 release: the Orage clock doesn’t show a transparent background even if it is set to show one. (Upstream bug in Xfce: 11915.)

Don’t be afraid! Instead of using the Orage applet, you can use the DateTime and Clock applets to get a transparent background – and while they itself do not allow for changing the color of the text in the applet, you can work around that with a .gtkrc-2.0 file in your home directory. Here’s how.

Set up the applets

To set up the applets, simply add the DateTime and/or Clock applets to your panel. You can control the format in which the time/date is shown in the applet via their preference dialogs found from their right-click context menus.

Bear in mind, if you wish to have two different clocks in the panel, we will be using the regular panel foreground (text) color for DateTime (white for Greybird) and modify the text color for the Clock applet in the steps below.

Modify the Clock applet color

To modify the Clock applet foreground color, we will need to make a modification in a theming file. The best way to do this is to use the per-user config file, found at ~/.gtkrc-2.0. If you don’t have this file, simply create one.

The code snippet to modify the Clock applest text color is the following:

style "panel-clock-custom"
{
fg[NORMAL]    = "#66CCCC"
fg[PRELIGHT]    = "#66CCCC"
fg[ACTIVE]    = "#66CCCC"
text[NORMAL]    = "#66CCCC"
text[PRELIGHT]    = "#66CCCC"
text[ACTIVE]    = "#66CCCC"
}
widget "Xfce*Panel*clock*"    style "panel-clock-custom"

In this snippet, we’re setting the foreground color for all the Clock applets to a certain turquoise – #66CCCC – which compliments the 15.10 wallpaper well.

You can substitute this hex color value with any other that fits your needs.

The end result

For me, the end result looks like this:

Xfce panel clock applets

Have fun modifying your own!

A series of minor improvements for Ubuntu websites

In addition to using developer documentation (see A compact style for jQuery API documentation), people who work with communities need to use community and communication related websites. The bigger the community, the more tools it needs.

In a large community like Ubuntu, the amount of maintenance is big and the variety of platforms is huge. On top of these, many of the website aren’t directly maintained for the community (which has both good and bad sides). For these reasons, it’s sometimes hard and/or slow to get updates landed for the CSS files for the websites.

While workarounds aren’t ideal, at least we can fight the problematic styles with modern technology. That said, I’ve created a gist for a Stylish style that provides some minor improvements for some ubuntu.com websites.

Currently, the style brings the following improvements:

  • The last line of the chat is completely shown in Ubuntu Etherpad pads
  • Images and code blocks aren’t overlapping the content section in Planet Ubuntu, avoiding horizontal scrollbars fix is in production!
  • In the Ubuntu wiki, list items do not have a large bottom padding, making the lists more readable
  • Also in the wiki, tables are always full width but not too wide, keeping them aligned nicely

If you are constantly hitting other annoying styling issues on the Ubuntu websites, leave me a comment and I’ll see whether I can update the gist with a workaround. However, please report the bugs and issues for concerned maintaining parties as well, so we can stop using these workarounds as soon as possible. Thank you!