いざというときに備えて、あるいはサーバの移転などの前に、ワードプレスのデータベースのバックアップを取っておくことは不可欠です。「WP-DB-Backup」を使うと、ワンクリックで必要なデータが自分のPCにダウンロードできます。

使い方は解説の必要がないほど簡単で、インストールした後に、ワードプレスの管理画面の「ツール」内に位置する「バックアップ」に行き、プラグインがダウンロードするのを少し待つだけです。また、1時間毎から週1回の間の頻度で自動的にバックアップを指定のメールアドレスに送信させることも出来ます。

ダウンロードされる「XXXX.sql.gz」というファイルを、サーバにある「phpMyAdmin」というアプリケーションを使ってインポートすることで、サイトの再構築やサーバの移転の際に、サイトのコンテンツはもちろん各種設定も簡単に復旧できます。ワードプレスを使ったサイトの復旧・移転の手順の詳細は、「WordPressサイトの再構築&サーバ移転」に記述しているので興味のある方はご覧下さい。

「WP-DB-Backup」のダウンロードページには、このページから、あるいは、WordPressのPluginのページや管理画面でのプラグインページで「WP-DB-Backup」と検索することでアクセスできます。…

ワードプレスで作ったサイトのポスト・ページを、縦に分割するときに便利なのが、「WP Post Columns」というプラグインです。横に広いページでは、読者は左右に大きく目を動かして文字を追わなくてはならないので、ページをいくつかのコラムに分割してしまうと読みやすくなるという利点があります。また、デザイン的にも、一つのコラムに縦長の画像を入れたりと工夫次第で色々と使えるはずです。

使い方はいたって簡単です。ページ･ポストを編集する際に、「ショートコード」と呼ばれる短いタグを挿入するだけで、ページを好きなように分割できます。

2 コラムレイアウトの例


[column width="47%" padding="6%"]
最初のコラムの内容。
[/column]
(空白行)
[column width="47%" padding="0"]
2番目のコラムの内容。
[/column] [end_columns]


3 コラムレイアウトの例


[column width="30%" padding="5%"]
最初のコラムの内容。
[/column]
(空白行)
[column width="30%" padding="5%"]
2番目のコラムの内容。
[/column]
(空白行)
[column width="30%" padding="0"]
3番目のコラムの内容。
[/column] [end_columns]…

Lightbox 2 (プラグイン)の記事で、サムネイルイメージを拡大させるプラグインを紹介していますが、拡大イメージがうまく閉じられないケースに遭遇したのでとりあえず類似のプラグインをここでご紹介しておきます。(当サイトではきちんと作動しているので、プラグイン自体のバグということではないようですが・・・)

Lightbox Plusを使うと、Lightbox 2と同じように、サムネイル表示のイメージをスマートに拡大表示させることができます。枠の色等のオプションが豊富に用意されているので、こちらの方が使いやすいかもしれません。

「Lightbox Plus」のダウンロードページには、このページから、あるいは、WordPressの
Pluginのページや管理画面でのプラグインページで「Lightbox Plus」と検索することでアクセスできます。…

WordPressを利用したサイトのページメニューを分割して表示させるにはどうしたらよいのでしょうか。たとえば、「About us」・「Sitemap」・「Link」などナビゲーションに関するものをページトップに小さく配置し、メインのコンテンツをサイドバーにまとめるというようなケースです。

以前に「WordPress Navigation List Plugin NAVT」というプラグインをご紹介しましたが、このプラグインを導入するのは少しややこしいと感じられる方もおられるかもしれません。そこで、「Exclude Pages」というプラグインのご紹介です。やり方は異なりますが、基本的に同じ目的がより簡単に達成できます。

使い方

「Exclude Pages」を導入すると、ワードプレスのページ管理画面に「Include this page in lists of pages」というチェックボックスが追加されます。「このページをページリストに含める」という項目で、デフォルトではチェックが入っているため、新規作成のページは自動的にページメニューに追加されていきます。一方で、チェックをはずすと、そのページはページメニューに反映されなくなります。

このプラグインの機能を使うと、特定のページへのリンクをページメニューから切り離して表示させることが簡単にできます。「Exclude Pages」のチェックをはずした上で、そのページへのリンクをテンプレートのヘッダー、サイドバーまたはフッターなど好きな場所に設置します。リンクを張るためには基本的なHTMLとCSSの知識が必要になりますが、ネットで調べれば難しくないのが分かるはずです。

この方法では、「About us」・「Sitemap」・「Link」といった特定のページへのリンクをテンプレートに直接書き入れる一方で、他のコンテンツページには手を加えなくても良いので、「WordPress Navigation List Plugin NAVT」に比べるとシンプルです。

ページの数が多く、メインコンテンツを複数に分割し、かつ「リンク」「サイトマップ」といったナビゲーションページも切り離して、、、という大掛かりなケースには、「WordPress Navigation List Plugin NAVT」を利用した方が良いとは思いますが、いくつかのページだけをメインメニューから切り離すだけという目的なら「Exclude Pages」の方が簡単で便利です。

「Exclude Pages」のダウンロードページには、このページ…

WordPressを利用して、ブログではないサイトを本格的に作る際に欠かせないのが、「Wordpress Navigation List Plugin NAVT」というプラグインです。ワードプレスはブログの作成という出発点から発展してきていているため、多くのページを管理するという機能についてはまだ発展途上です(2009年末現在)。例えば、WordPressとしばしば比較されるJoomlaは、ページ管理というCMS(コンテンツマネジメントシステム)の機能ではかなり上を行っていると言えるでしょう。

「Wordpress Navigation List Plugin NAVT」を使うと、デフォルトではやや物足りないワードプレスのCMS機能を簡単に拡張できます。ワードプレスのデフォルトではページメニューを分割することができないため、ワードプレスをベースにしたサイトではページの数に関わらず、ページメニューをサイドバーかページトップにまとめるのが普通だと思います。当サイトも、ページメニューをサイドバーにすべて収めているというパターンです。

これはこれで問題はないのですが、ページの数が増えてきた場合、もしくはページメニューをカテゴリー別に分けて異なる場所に配置したい場合などには、このプラグインを使う価値があります。たとえば、「About us」・「Sitemap」・「Link」などナビゲーションに関するものをページトップに小さく配置し、メインのコンテンツをサイドバーにまとめることなどができます。以前にご紹介した「PageMash」の、ページメニューの順番を入れ替えるという機能に加えて、ページ・ブログカテゴリーの自由な分割が可能になるので、デザインの自由度もグッとあがることでしょう。

* この「Navigation List Plugin NAVT」の設定がややこしいと思われる方は、プラグイン「Exclude Pages」もご覧ください。

使い方

1) 「Wordpress Navigation List Plugin NAVT」を所定の位置にアップロードしてから、WordPress(ワードプレス)のコントロール画面から設定をします。初めての場合どこをどうしたらいいのか分かりにくいので、キャプチャーイメージを使って簡単に流れを見てみます。

1-a) これが「Navigation List Plugin NAVT」の管理画面です。画面の左、中央から下段にかけて、ページ・カテゴリのリストが示されています。

1-b) リストの中から好きなものをクリックすると画面の左、中段にアイテムが移動します。ここでは、「About」と「サイトマップ」をクリックしてみました。ここでは、この2つのアイテムをひとまとまりにしてページのどこかに配置するという例を説明します。

1-c) 画面左上の「group name」に好きな名前を打ち込みます。ここでの注意は、「半角英数を使用する」・「ブランクスペースを入れない」・「特殊記号を使わない」という点です。というのも、この「group name」をワードプレスのテンプレートに書き込む必要があるからです(後述)。ここでは、「site_navi」という名前を使ってみます。「create」をクリックで、画面右側に「site_navi」が現れます。…

「ブログ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」を使いこなすことができます。詳細は、プラグイン…

イメージをブログ記事内にアップロードするときに便利なのがFlexible Uploadというプラグインです。このようなプラグインを使うと、WordPressのコントロール画面からテキストを入力するようにイメージをアップできます。もちろん、サーバのFTPアップローダーを使ってイメージをアップロードすることができますが、別のブラウザのページを開いての作業・イメージへのパスを指定する等の手間がかかります。(といっても大したことはないかもしれませんが…)

Flexible Uploadでは、イメージのサイズ・位置・名前などをポップアップウィンドウから簡単に指定できます。(左のイメージは、ポップアップウィンドウの例です。) 加えて、Flexible Uploadの素晴らしいのは、他のプラグインとリンクさせることで、イメージの表示の仕方もコントロールできるという点です。例えば、Lightbox2などとリンクさせることができます。(他にも、Greybox・Thickbox・HighslideJS・LightWindowなど。) Flexible Upload管理画面から、リンクするプラグインを選んで、そのプラグインをWordPressにアップするだけでセットアップが完了です。

[ *2010年10月追記： このプラグインは、WordPressの最新のバージョン3.0ではうまく動作しないようです。最新の(あるいはそれに近い)バージョンのWordPressではイメージのアップロード機能もしっかりしているので、このプラグインを使う意味はなくなっているともいえます。]

[ *このエントリーはLightbox 2の記事と対になっています。合わせてご覧ください。]

「Flexible Upload」のダウンロードページには、このページから、あるいは、
WordPressのPluginのページで「Flexible Upload」と検索することでアクセスできます。…

写真をブログ記事内にサムネイル表示させる時に便利なのがこのLightbox2というプラグインです。サムネイルがクリックされると、モニター画面が暗転し拡大イメージが中央に表示されます。写真のみのブラウザページが開かれるよりも、スマートな表示の仕方だと思います。WordPressの管理画面からは、写真が拡大されたときの枠の色をホワイト、ブラック、グレー、ダークグレーの中から選べます。左のイメージ (WordPressプラグインのLightboxページ) をクリックすると、Lightbox2で表示されます(色はブラック)。

[ *このエントリーはFlexible uploadの記事と対になっています。合わせてご覧ください。]

「Lightbox 2」のダウンロードページには、このページから、あるいは、WordPressの
Pluginのページや管理画面でのプラグインページで「Lightbox 2」と検索することでアクセスできます。…

WordPress (ワードプレス) のブログのエントリーを月別やカテゴリー別などのアーカイブモードで見たときに、記事内のリンクが機能していなかったりパラグラフ間のスペースが消えてしまっていたりして「あれっ」と思ったことはありませんか。ブログの記事を単独で見たときには思った通りに表示されるのに、複数の記事を一覧させると自分が打ち込んだHTML情報がそのまま反映されないという問題です。

初めてこれに気がついたときは、当時使っていたワードプレスのテンプレートの機能なのかと思っていました。実際のところ、これはワードプレス自体の機能で、いわゆるアーカイブモードで複数記事を見る際にはHTMLマークアップが反映されないのが普通です。パラグラフ間の空白がなくなることで文字ばっかりの印象になってしまったり、リンクが効かないというのを避けたい場合には、プラグインを利用することでこれに対応することが可能です。

「Advanced Excerpt」を使えば、通常なら無視されてしまうHTML情報をアーカイブモードでも反映するように設定できます。
このプラグインをダウンロード・所定の位置にアップロードすると、ワードプレスの管理画面からどのHTML情報を保持させるのかを簡単にコントロールできます。左上のイメージ (クリックで拡大) のように、アーカイブモードでの記事の抜粋の長さを決めHTMLマークアップにチェックを入れるだけというように非常に簡単です。

「Advanced Excerpt」のダウンロードページには、このページから、あるいは、
WordPressのPluginのページで「Advanced Excerpt」と検索することでアクセスできます。…