Drupal ですぐに使える人気の無料テーマ トップ 10選 +α

こんにちは。プログラマーの山中です。

田植えの季節ですね！ビニールハウス内の青々とした苗を見ると初夏なんだなと感じます。

さて、今回はすぐに使える Drupal の人気のテーマを10個、ご紹介します！

はじめに

Drupalを個人で使用している方やDrupalを初めて使う方の場合、テーマは決め打ちですぐに使えるものを選び、 コンテンツの作成や機能(モジュールなど)の設定に力を注ぎたいという方が多いのではないでしょうか。

そこですぐに使えるテーマを探していくと drupal.org の Theme project ページに行き当たることと思います。

Theme project ページにはDrupal用のテーマが人気の高いものから順番に一覧として表示されています。 ここで配布されているDrupalのテーマは使う用途によって大きく分けると以下の3つに分類されます。

• 管理画面用テーマ (サイト管理者向き)
• ベーステーマ (開発者向き)
• すぐに使えるテーマ（サイトオーナー向き）

たくさんのテーマが無料で公開されておりすぐに利用できるのはよいのですが、 Theme project ページのフィルターを使ってもすぐに使えるテーマを見つけ出すのはちょっと難しく、 「Drupal 無料 テーマ」などのキーワードでGoogle検索しても英語で紹介されている記事ばかりが出てきてしまいDrupal 7 のテーマを紹介している日本語の記事はあまり出てこないんですよね・・・。 このあたりのところが、Drupal入門者にとってのハードルを高くしてしまっている大きな原因のひとつになっているように思います。

ということで前置きが長くなりましたが、この記事では Theme project で公開されているコントリビュートテーマの中から すぐに使える定番テーマ を10個、キャプチャとそのテーマの特徴といっしょにご紹介したいと思います！

テーマのインストール方法についてはこちらの記事をご覧ください。 → Drupal 7 のテーマのインストール方法 | Studio Umi+

また、同じ趣旨で人気モジュールを20個紹介している記事もありますのでよければご覧いただければと思います → Drupal 7 の定番人気モジュールトップ 20 | Studio Umi+

人気テーマトップ 10

以下のリストをご覧いただく際に次のポイントにご留意いただければと思います。

• ※ 各キャプチャ画像はヘッダーリージョン、あるいはそれに近いリージョンにサイトのメインイメージとなるような画像をブロックで追加し、より実際の活用イメージに近いものをお出ししています。
• ※ キャプチャ画像はブラウザの幅 1024px で撮ったものとなります。

1. Bootstrap (bootstrap)

Twitter Bootstrap を元に作成されたシンプルなテーマです。

Bootstrap テーマには以下の特徴があります。

• 1〜3 カラムのレイアウト
• BootstrapCDN の使用
• BootstrapCDN を介して Bootswatch のテーマが使用可能
• Icon API モジュール を介してアイコンフォント Glyphicons が使用可能
• レスポンシブ対応
• メインメニューの追従(画面最上部に固定)設定
• パンくずリスト
• その他ツールチップ、スムーズスクロールなど JavaScript 系のものなど

今回紹介するテーマのなかでは圧倒的な人気ぶりです。 Bootstrap 自体が有名だからという理由もあるかと思いますが、 モダンなデザインで、テーマディレクトリ内にサブテーマ作成用テンプレートも用意されています。 そのままでもベーステーマとしても使えるという柔軟さが人気の理由ではないでしょうか。

2. Corporate Clean (corporateclean)

Corporate Clean テーマには以下の特徴があります。

• 1〜3 カラムのレイアウト
• レスポンシブ対応(ver 2.x 以上)
• パンくずリスト
• スライドショー (リージョン型)
• Color モジュールを使用
• Respond.js
• 複数階層のドロップダウンメニュー

Respond.js は IE6-IE8でレスポンシブ対応させるときには欠かせない存在ですし、 パンくずリスト、複数階層のドロップダウンメニューやスライドショーの機能など、 無駄は少ないけど欲しい機能は入っているという意味で、まさに名前の通りコンテンツの多い「企業向け」なテーマです。

Color モジュールを使用しているのでサイトをコーポレートカラーに変更することもできますね。

3. Marinelli (marinelli)

• ※ 2015/4/29 現在、最新バージョンは 7.x-3.0-beta11 のベータ版です。 不具合が存在する可能性があるため、使用する際は注意してください。

Marinelli テーマには以下の特徴があります。

• 1〜3カラムの固定幅レイアウト
• スライドショー (環境画面で設定型)
• レイアウト設定
• メガメニュー (ドロップダウン)
• CSS3 使用設定

スライドショー機能がデフォルトで付属している点が大きな特徴です。 スライドショーは管理画面でいくつでも設定することができます。

4. Danland (danland)

Danland テーマには以下の特徴があります。

• 1〜3 カラムのレイアウト
• 17個のリージョン
• スライドショー (リージョン型)

環境設定で設定できる項目に特殊なものはありませんが、多くのリージョンが用意されています。 Drupal7 のデフォルトテーマのbartikもリージョンが多いのですが、それを超えるリージョンの数ですね。

5. Business (business)

Business テーマには以下の特徴があります。

• 1〜2 カラムのレイアウト(サイドバーは左か右か選べる)
• 920px 固定幅
• Color モジュールを使用
• 12個のリージョン
• 複数階層のドロップダウンメニュー
• パンくずリスト

シンプルで飽きのこないデザインです。 こちらも企業サイトには欲しい機能がそろっていますね。

6. BlueMasters (bluemasters)

BlueMasters テーマには以下の特徴があります。

• 2〜3カラムのレイアウト
• レスポンシブ対応
• 12個のリージョン
• スライドショー
• 複数階層のドロップダウンメニュー
• コメントカウンター
• Respond.js

フロントは別のテンプレートファイルが存在するため、違うレイアウトとなります。 SNSボタンはテンプレートファイルで直書きされているため管理画面から削除することはできません。

7. MAYO (mayo)

MAYO テーマには以下の特徴があります。

• 1〜3カラムのレイアウト
• レスポンシブ対応
• Color モジュールを使用
• パンくずリスト
• 細かなレイアウト設定
• スタイル設定
• フォント設定

レイアウトに対する色んな設定(サイドバーの幅からヘッダーのロゴのマージンまで！)や ある程度のスタイル設定が管理画面から GUI を通してできるので、 CSSを知らない人でも細かく自分好みの見栄えにカスタマイズすることができるテーマです。

8. Skeleton (skeletontheme)

Skeleton テーマには以下の特徴があります。

• 1〜3カラムのレイアウト
• レスポンシブ対応
• Color モジュールを使用
• 複数階層のドロップダウンメニュー
• 14個のリージョン

Wordpress の skeleton というテーマに触発されて作られたようです。文字が見やすいテーマです。

9. Pixture Reloaded (reloaded) - Adaptive theme のサブテーマ

• ※ デフォルトはピンク色のテーマですが眩しかったのでキャプチャ図内では緑色のカラーセットに変更してます。
• ※ テーマの環境設定で「Set the page width」を 「960 px」に設定しています。

人気の高いベーステーマのひとつ Adaptive theme をベーステーマに作成されたテーマです。 手動でインストールする際、テーマディレクトリに Adaptive theme をダウンロードしておく必要があります。

Pixture Reloaded テーマは Adaptive theme の機能や設定を受け継いでいるため以下のような特徴があります。

• 1〜3カラムのレイアウト
• レスポンシブ対応
• Color モジュールを使用
• レスポンシブ対応
• 細かなレイアウト設定(タブレットやスマホ閲覧時の設定も可能)
• 細かなスタイル設定
• メタタグ設定
• 開発用の設定

...などなど。

Adaptive themeにはたくさんの機能や設定項目がありその全体像はここでは紹介しきれません。 その他機能については Adaptive theme のドキュメント を確認するか、 実際にインストールしてご確認ください。

10. Corolla (corolla) - Adaptive theme のサブテーマ

• ※ デフォルトは灰色っぽいテーマですがキャプチャ図内では個人的な気分で緑系のカラーセットに変更してます。
• ※ テーマの環境設定で「Set the page width」を 「960 px」に設定しています。

Corolla テーマも Adaptive theme をベーステーマに作成されたテーマです。

こちらも Adaptive theme の機能や設定を受け継いでいるため以下のような特徴があります。

• レスポンシブ対応
• 細かなレイアウト設定(タブレットやスマホ閲覧時の設定も可能)
• 細かなスタイル設定
• メタタグ設定
• 開発用の設定

こちらも詳しい機能については Adaptive theme のドキュメント を確認するか、実際にインストールしてお試しください。

個人的におすすめなテーマ

最後に個人的にお気に入りのテーマを紹介させてください。

Responsive Bartik D7 (responsive_bartik)

Drupal 7 をインストールしたときのデフォルトテーマである Bartik をレスポンシブにしたテーマです。 Drupal 8 でデフォルトで使われている Bartik テーマとほぼ同じものと考えてよいでしょう。

デフォルトの Bartik と同じようにカラー設定を行うことができます。

Beauty Theme (beauty_theme)

かわいい(∩´∀`)∩♡

特筆するような機能はありませんが、 h1の書体(日本語は明朝体)やリボンみたいなメニュー、ヘッダー上部のピンクの水玉などなど、 女性向けと言っても良いような可愛らしいデザインのテーマです。 個人的にはサイドバーの区切りに使われているギザギザラインが一番の素敵ポイントです。

以上です。 いかがだったでしょうか？

今回は Drupal のコントリビュートテーマのうち、そのまますぐに使えるものを 10 個 + α ご紹介させていただきました。

Drupal を個人的に利用してみたい方。 Drupal の利用を検討中で制作会社に声をかける前にまずは自分で試してみたい企業の Web 担当者の方。 Drupal のデフォルトテーマだとちょっと感じがわからない、使いづらいという場合には今回ご紹介したテーマを使うと便利です。 ぜひご参考になさってみてください。