Until recently I was satisfied with the bluemarine theme, but now a few problems bothers me.

1. Font size is too big for book titles in the book outline of the left sidebar menu.
2. It’s rather difficult to distinguish h1 and h2 in contents.
3. On chrome, font size of inlined code is smaller than on IE. (Block-level codes have the same problem when GeSHi filter is set to GESHI_HEADER_DIV, not GESHI_HEADER_PRE.)

I tried to solve those problems with the previously created module’s CSS. But it can’t override theme’s CSS because it’s placed after other modules’ CSS’s but before theme’s CSS. So, I had to follow the standard procedure by creating subtheme. I was somewhat afraid of spending too much time, but creating subtheme itself was very easy.

First, decide a short and lowercase-only module name, similar to when creating module. (Again, I chose “moonz”) And also similarly, create a directory called site/all/theme/.

Create .css. (That name is not required but better not coincide with base theme’s CSS file name, or it will override.) I had custom module’s CSS, so I moved it to the subtheme directory. To move, I had to remove moonz_init hook defined at moonz.module in the module directory. (Of course, if there’s no CSS to reuse, just create an empty one.)

Create moonz.info in the subtheme’s directory.

And it’s done. New subtheme is created.

• Administer > Site building > Themes
  • Switch to newly created theme.

From now on, you can fix problems with CSS. (Again, chrome’s “developer tools” (or “inspect element”) becomes very useful.) For actual solutions to the problems listed at start. see the next article.