WordPressを利用したサイト構築(中編1) - Webサイト制作最新トレンドの傾向と対策 | デザインってオモシロイ -MdN Design Interactive-

WordPressを利用したサイト構築(中編1) - Webサイト制作最新トレンドの傾向と対策

2024.4.24 WED

【サイトリニューアル!】新サイトはこちらMdNについて
web creators特別号
HTML5・スマートフォン・SNS・Webアプリケーション
Webサイト制作最新トレンドの傾向と対策

サイト構築&運用 5-02
WordPressを利用したサイト構築(中編1)

前述の通り、CMSは、非常に多くの種類がある。ここでは、数あるCMSの中でも、最近特に成長しており、利用者数の多いCMSである「WordPress」について、いくつかの事例を交えて解説しよう。

制作・文/星野邦敏(株式会社コミュニティコム代表取締役)



WordPressのメリット

ここまでWordPressのシェア拡大や利用事例について述べてきた。次に、実際に採用される理由として考えられる、WordPressのメリットを見ていこう。


オープンソースであること

まず、第1 のメリットとしては、WordPressはGPLライセンスで提供されているオープンソースCMSという点だ。そのため、誰でも無償でソースコードを入手して、自分のサーバーに設置することができる。さらに再配布も自由だ。ただし、ライセンス料がかからない代わりに無保証であることも、CMS選定の際には注意しなければならない。なおWordPressは、特定製品に依存しない技術的な中立を保持するため、利用機会の多いPHPプログラムとMySQLデータベースで構成されている。このため、PHPやMySQLをさわった経験のある人であれば、WordPressをカスタマイズすることも比較的容易に行うことができるだろう。


カスタマイズ性の高さ

第2のメリットとしては、カスタマイズが柔軟にできるという点だ。WordPressのコアで実装されている機能やデザインは、非常にシンプルに作られている。インストール直後は、「Twenty Eleven」【01】というブログのようなデザインであり、メールフォーム等の機能も付いていない。その代わり、WordPressには非常に多くのフックが用意されており、自分に必要な機能はそのコアのフックに掛けることで「プラグイン」という形で追加する。このプラグインは、公式ディレクトリに17,000を超える登録があり、プログラムを書かなくても、自由に選択して使うことができる。もちろん、プログラムがわかれば、自分でプラグインを作ってサイトを機能拡張することも、自分のプラグインを公式ディレクトリに登録することもできる。公式ディレクトリに登録され、多くのサイトで使われるようになるとフィードバックが増えて改善されていくのは、オープンソースならではと言えるだろう。

WordPressのデザインは、「テーマ」というサイトの外観を作り上げるためのPHPファイルとCSSファイル、必要に応じてjsファイルや画像ファイルをセットとしたフォルダで構成される。このフォルダを、wp-content > themes という階層下に置くことで、サイトデザインの着せ替えのように、見た目の調整だけでなく、表示する内容を操ることができる。公式ディレクトリに登録されているWordPressテーマを管理画面から自由に選択することが可能だ。もちろん、自分でカスタマイズしてオリジナルのサイトデザインを作ることも簡単だ。公式ディレクトリに登録することもできるのは、プラグインと同様だ。

【01】WordPress デフォルトテーマである「Twenty Eleven」。WordPressをインストールした初期の状態では、このデザインである。
【01】WordPress デフォルトテーマである「Twenty Eleven」。WordPressをインストールした初期の状態では、このデザインである。


ユーザーの多さ

第3のメリットとしては、前述もしたが、WordPressは日本国内のみならず世界的に利用者が多いという点だ。

利用者が多ければ、それだけ制作事例が集まるため、WordPressカスタマイズの情報も豊富だ。また日本での普及率も高いことから日本語の情報も多く公開されているので、不明点も検索をするだけで解決できることが多いだろう。オープンソースのプロジェクトだけに、利用するユーザーが多いほど、フィードバックが多く、より発展していくのは明らかである。現在のWordPressは、多くの人が利用している→より改善が行われる→さらに多くの人が利用する、という好循環の中で成長していると言ってよいだろう。


プラグインによる機能追加例(1)

前述の通り、WordPressの場合、サイトデザインは「テーマ」で行い、機能追加は「プラグイン」で行う。WordPressの公式ディレクトリに登録されているだけでも、テーマ数は1,400を、プラグイン数は17,000を超えている。

これからWordPressを使いたい人にとっては、数が多すぎて、具体的にどのようなテーマやプラグインがあるのか、むしろ把握しにくいかもしれない。ここでは公式ディレクトリに登録されているお勧めのプラグインをいくつか紹介しよう。


Contact Form 7 プラグイン

サイトやブログとして、お問い合わせメールフォームが必要となる場合あるだろう。このような時は、Contact Form 7プラグイン【02】がお勧めだ。日本国内だけでなく、WordPressのメールフォームとしては世界で最も使われているプラグインだ。Contact Form 7 プラグインは、作者が日本人ということもあり、メールフォームによくある文字コードの違いによる文字化けについても考慮されているので、安心して使うことができる。メールフォームの設置数を増やせるだけでなく、複数のメールアドレス宛てに送信したり、フォームの項目や文章も柔軟に追加・編集をすることができるので、試してみてほしい。

【02】Contact Form 7 プラグインの使用例(http://www.salesrepinternational.com/mail.html)
【02】Contact Form 7 プラグインの使用例(http://www.salesrepinternational.com/mail.html


Lightbox 2 プラグイン

Lightbox 2 プラグイン【03】は、リンクのある画像をクリックすると、画像が浮き上がるようなデザインとなるプラグインだ。画像を強調したいサイトでは、プラグインを有効化するだけで実装できることから、手軽なプラグインと言えるだろう。

【03】Lightbox 2 プラグインの使用例(http://www.salesrepinternational.com/amarone6.html)
【03】Lightbox 2 プラグインの使用例(http://www.salesrepinternational.com/amarone6.html


Cawaii Admin プラグイン

WordPressの管理画面は、シンプルなデザインで作られているので、管理画面のデザインに物足りない人もいるかもしれない。そのような人には、CawaiiAdmin プラグインがお勧めだ。実際に、「ころぐ - 子そだて家族のための会員制ブログ」は、Web サービス全体がWordPressで作られていて、その管理画面は【04】のようになっている。WordPress の管理画面をご存知の方は、ここまで変えられることに驚くかもしれない。Cawaii Admin プラグインを有効化すれば、このような実装を簡単にすることができる。自分でも管理画面に彩りを持たせたい場合、他ユーザーや他企業に管理画面を渡す場合のアレンジなどに、利用することができるだろう。

【04】Cawaii Adminプラグインの使用例 ころぐ - 子そだて家族のための会員制ブログ(http://colog.jp/)
【04】Cawaii Adminプラグインの使用例
ころぐ - 子そだて家族のための会員制ブログ(http://colog.jp/



WP Total Hacks プラグイン

WP Total Hacksプラグイン【05】は、WordPressをクライアント向けに納品する際には必須のプラグインと言えるだろう。

具体的には、ログイン画面のWordPressロゴを変更できたり、管理画面のフッターのテキストを変更できたり、faviconを簡単に追加できたり、管理者権限以外のユーザーにはアップデート通知を非表示にする設定ができたりと、WordPressを納品する際に考えられる様々なことに配慮されているプラグインである。

言い換えれば、WordPressをクライアント向けに納品する際に、いわゆるWordPress色を消すことができるプラグインとも言える。たとえば、WP Total Hacks プラグインを用いてログイン画面のWordPressロゴを自社のロゴに差し替えれば、あたかも自社のパッケージCMSのように見せることも可能だろう。WordPressはGPLライセンスであるから、このような変更も問題ない。その他にも、クライアントに納品する際に、制作会社が管理権限を持ち続け、クライアントには編集者権限などコンテンツを入力する権限のみを渡す場合もあるだろう。このような時にWordPress自体のバージョンアップ通知や、テーマやプラグインのバージョンアップ通知が管理画面に表示されてしまうと、そのたびに担当者から問い合わせが来てしまうかもしれない。そのような通知の表示を無効化する機能もWP Total Hacks プラグインには実装されている。

【05】WP Total Hacks プラグイン(http://firegoby.theta.ne.jp/wp/wp-total-hacks)
【05】WP Total Hacks プラグイン(http://firegoby.theta.ne.jp/wp/wp-total-hacks


Feedback Champuru プラグイン

Feedback Champuru プラグイン【06】は、WordPressのコメント欄に、その記事URLに対するTwitterやGoogle+やはてなブックマークなどの反応をコメントのような形で反映してくれるプラグインだ。

人のブログを読んでも、わざわざコメントを付けることはしなくても、Twitterにつぶやいたり、Google+ に書いたりする人はいるだろう。Feedback Champuruプラグインは、それらをブログのコメントのように表示してくれるので、自分の記事に対してどのような感想が寄せられたのか、そのフィードバックを得ることができる。

WordPressをブログとして使っている人には特にお勧めのプラグインだ。

【06】Feedback Champuru プラグインの使用例(http://wp3.jp/2011/11/18/wordcamp-tokyo-2011/)
【06】Feedback Champuru プラグインの使用例(http://wp3.jp/2011/11/18/wordcamp-tokyo-2011/

(中編2に続く)


[目次に戻る]

【本記事について】
2012年1月28日発売のweb creators特別号「Webサイト制作最新トレンドの傾向と対策」から、毎週記事をピックアップしてご紹介! HTML5・CSS3によるコーディングから、次々と生まれてくる新しいソーシャルサービス、Webアプリケーション、スマートフォンやタブレット端末への対応など、いまWeb制作で話題になっているトピックを網羅した内容になっています。

※本記事はweb creators特別号『Webサイト制作最新トレンドの傾向と対策』からの転載です。この記事は誌面でも読むことができます。

twitter facebook このエントリーをはてなブックマークに追加 RSS
【サイトリニューアル!】新サイトはこちらMdNについて

この連載のすべての記事

アクセスランキング

8.30-9.5

MdN BOOKS|デザインの本

Pick upコンテンツ

現在