「ブログWordPress を使ってみよう」のページでも若干の説明をしていますが、ブログソフトのWordPressはブログの作成運営のみに便利なだけではなく、普通のホームページを構築する際にも大変役に立ちます。

まず、ここでの「ブログ」と「ホームページ」の区別を簡単にしておきます。「ブログ」は、日記サイトに代表されるように毎日の更新ページがページのコンテンツそのものというサイトです。「ブログ」にも管理人の紹介ページなどといった日々更新されないページもありますが、こうしたものはメインコンテンツではないのが普通でしょう。一方で、「ホームページ」は、コンテンツ・目的別に異なるページが用意されている、いわゆる普通のホームページです。

ただ最近では、こうした区別があいまいになってきているかもしれません。というのも、「ホームページ」であっても日々更新されるセクションを設けていることがよくあるからです。

「ブログ」と「ホームページ」両者の良いところを取り入れた「ハイブリッドなサイト」の利点はなんでしょうか。まず、目的別のページを複数持つことで、重要なコンテンツが他の記事の中に埋もれてしまうのを回避できます。同時に、更新がしやすいセクションも設置することで、より頻繁な更新が容易になりページに訪れてくれる人によりアピールすることができます。

近年ではCMS－コンテンツマネジメントシステムとして、管理のしやすいサイトがスタンダードになってきています。前置きが長くなりましたが、WordPressは「ブログ」を作成はもちろん、「ホームページ」や「ハイブリッドなサイト」も簡単に実現できてしまうパワフルなツールです。WordPressを利用したサイト作成のコツはなんでしょうか。

1) ページデザインの選択

まず、作成するページのスタイルを選択します。(ブログではない)ページを追加していく可能性を考えると、メニューバーがページのトップに並列されるものより、サイドバーに縦に並ぶスタイルが良いかもしれません。多くのテンプレートが無料でダウンロードできます。なお、メニューバーの位置やバックグランドイメージなどは比較的簡単に変更できるので、いろいろとカスタマイズしていくのも楽しいものです。テンプレートについては「WordPressのテンプレートのダウンロード」、カスタマイズについては、「WordPressテンプレートのカスタマイズ(1)」・「WordPressテンプレートのカスタマイズ(2)」などをご覧ください。

2) WordPressの基本設定

WordPressの管理画面の表示設定セクションでフロントページの設定をします。ブログセクションではなく、ページを最初に表示をさせるためには、デフォルトの「最新の投稿(Your latest posts)」ではなく「固定ページ(A static page)」にチェックを入れます。それから、どの固定ページをフロントページに持ってくるかをドロップダウンメニューから選択します。(もちろん、ページを前もって作成しておかないと選択肢は表示されません。) 固定ページをフロントページに持ってくるだけで、「ホームページ」という雰囲気になります。

ついでにパーマリンクの設定もしておきましょう。パーマリンクの設定をすることで、ブログ記事のアドレスがどのように表示されるかをコントロールできます。デフォルトでは「http://yoursite.com/?p=123」という形式です。ほかにも「http://yoursite.com/2009/09/09/sample-post/」という日付と記事タイトルを併記するパターンなどがあります。個人的なお薦めは、カスタム欄に「/%postname%/」を書き込むものです。この設定では「http://yoursite.com/postname」という表示になり、固定ページの表示パターンと同じになります。なお、「postname」に記事のキーワード等を入れることでSEO的に有利になるという利点もあります。

3) Pluginの導入

プラグインを導入することで、「ホームページ」の作成が断然簡単になります。「PageMash」を使うと、メニューバーにあるページリンクの並び替えが簡単にできます。「Navigation List Plugin NAVT」では、一歩進んで、ページメニューを分割して表示したりやブログをカテゴリー別に表示させたりできます。「DD Sitemap Generator」でサイトマップを作成するのはユーザビリティーを向上させるだけでなくサイトを「ホームページ」らしくするのに一役買うかもしれません。「…

あなたのサイトに「サイトマップ」のページはありますか? ユーザーがサイトの構成を知りたいときや目当ての情報に素早くアクセスしたいときなどに、サイトマップは非常に役立ちます。

ワードプレスで作ったHPにサイトマップを加えるときに便利なのが「Dagon Design Sitemap Generator」というプラグインです。これは、「Google XML Sitemaps」に代表されるXMLのサイトマップファイルを生成するプラグインとは異なり、サイトのユーザーが実際に利用するサイトマップを作成する際に利用します。簡単に色分けをするなら、XMLのサイトマップがSEO(サーチエンジン最適化)対策のためのもので、ページ内のサイトマップはサイトのユーザビィリティを高めるもの、と言えるでしょう。

1) 「Dagon Design Sitemap Generator」を所定の位置にアップロードしてから、WordPress(ワードプレス)のコントロール画面から各種の設定を行います。言語の選択(日本語にも対応)・アイテムの順序・表示の有無など、サイトマップの表示の仕方をいろいろと設定できるようになっています。

2) 次にワードプレスのページを新規作成し、本文を書き入れる欄に以下の一行をコピー&ペーストします。

 <!-- ddsitemapgen -->

この一行だけでサイトマップのページが作成され、ブログをアップする毎にサイトマップも自動アップデートされていきます。

3) なお、CSSを通してサイトマップのデザインをいろいろと変えることができます。このプラグインには2つのDIVタグが仕込まれており、これらをワードプレスのCSSファイルに加えることでデザインをコントロールできます。「.ddsg-wrapper」がサイトマップ全体のデザイン、「.ddsg-pagenav」がページナビゲーションのデザインに関わります。たとえば以下のようなものを付け加えます。

.ddsg-wrapper {color:#363636; font-size: 12px; line-height: 1.6em; font-family: Verdana, Tahoma, Arial, sans-serif;}

CSSファイルにあまり詳しい人でなくても、｛｝の中の書き方はいろいろなサイトで紹介されているので簡単に調べられると思います。

上記3つのポイントを押さえれば「Dagon Design Sitemap Generato」を使いこなすことができます。詳細は、プラグイン…