WordPressを利用して、ブログではなくCMSとして企業サイト・企業ウェブサイト作成・商用ホームページ制作のテクニックを公開。WordPressの最新ニュースやプラグインの紹介、自作プラグインやテーマも開発中。
ナビゲーションメニューを簡単に作成するプラグイン WordPress Navigation Tool (NAVT)

ナビゲーションメニューを簡単に作成するプラグイン WordPress Navigation Tool (NAVT)

NAVT Plugin Home | Act Fifty-Five
NAVT Plugin Home | Act Fifty-Five

WordPressで企業ウェブサイト作成・商用ホームページ制作 WordPress Go Goでは、企業サイトの重要な要素としてナビゲーションの必要性を説いている。企業サイトは、一般的なブログのように時系列で構成されるわけではないため、ユーザーが迷わず目的の情報まで到達できるようにきちんとしたナビゲーションを用意するのが大切だ。ナビゲーションといっても色々あって、ヘッダーやサイドバーにあるナビゲーションメニューと今表示しているページが一体どこなのかを表示するパンくずナビゲーションなどがある。パンくずナビゲーションプラグイン Breadcrumb Navigation XTについては以前紹介した通りだ。今回紹介するのはヘッダーやサイドバーにナビゲーションを表示するWordPress Navigation Tool (NAVT)というプラグインだ。

このプラグインを使用するとヘッダーやサイドバーに表示するナビゲーションメニューを簡単に作成することができる。作成したカテゴリーやページをドラッグアンドドロップで直感的に操作できるのが特徴だ。ダウンロードはWordPress › WordPress Navigation Tool (NAVT) « WordPress Pluginsより行う。

ここで問題が一つある。最新バージョンは95.43なのだが、どういうわけか日本語が文字化けする(????になる)というバグがある。プラグインの作者の方もこの問題は把握されているようで、フォーラムでも議論されており、今回のバージョンアップで修正されるはずだったのだが、どうもまだうまくいかないようだ。そのため、少々古いバージョンではあるが、95.20をダウンロードして使いたい。ダウンロードサイトにOther Versionsという箇所があり、そこに95.20があるのでそれをダウンロードしてほしい。最新バージョンの95.44では文字化けの問題がようやく解決された。これで安心して日本語でナビゲーションバーを作成できる。もう古いバージョンを使う必要はない。

インストールは簡単で、ダウンロードしたファイルを展開し、pluginsフォルダにアップロードし、有効化するだけである。インストールが終了すると管理メニューの「管理」に「NAVT Lists」が増えているのがわかるだろう。95.20では管理メニューの「プラグイン」に「NAVT Admin」も増えているはずだ。これはデータをリセットするために用意されており、NAVT AdminにあるRomove Dataをクリックすれば作成したナビゲーションバーを削除することができる。しかしながら、このNAVT Adminは最新バージョンでは最初のNAVT Listsへ統合されている。

Navigation Tool - NAVT Admin

ナビゲーションバーの作成は簡単だ。下記の説明は95.20を元にしているが、文言は違えど最新バージョンでもだいたい同様の方法でできる。問題は文字化けだけなのだが・・・。

  1. 右欄にあるGroup EditでGroup Nameを入力してNewボタンを押す。自動的にGroup枠が表示される。
  2. UNASSIGNEDと表示された枠にあるメニューのアイコン部分をドラッグアンドドロップで先ほど作成したGroup枠へ移動させる。もしナビゲーションに表示したいメニュー表記を変更する場合は、メニューをクリックして出てきたMenu Item Aliasを変更して緑のボタンを押す。これを繰り返す。
  3. ナビゲーションメニューができたら、右欄にあるForm ChangesでApplyボタンを押す。

Navigation Tool - 管理画面

これでナビゲーションの準備はできた。あとはテーマファイルを編集するだけだ。例えば、ヘッダーに表示するナビゲーションバーを作成したなら、テーマファイルのheader.phpを編集する。header.phpのナビゲーションを表示したい個所に下記の通り追加する。引数にはGroup Nameで指定した値を入れる。これでナビゲーションが表示されるようになるはずだ。あとはスタイルシートを適切に変更するだけである。

<?php
// Make sure the NAVT plugin is present
if( function_exists('navt_getlist') ) {
	navt_getlist('your_navigation_group_name');
}
?>

以上でナビゲーション作成の手順を終えるが、現状では古いバージョンの95.20を使わざる負えないのがつらいところだ。今までこのプラグインを紹介していなかったのはこのためである。最新バージョンでは操作性の向上やウィジェットへの追加、バックアップ機能、WordPress MUへの対応などが備わっている。次回バージョンで日本語がきちんと扱えるようになることを期待したい。

[追記] ようやく文字化けが修正された最新バージョンの95.44が登場した。制作者の方に感謝したい。

4 Comments

  1. Pingback: growfly » Blog Archive » デザイン・制作関係のブックマーク

  2. Pingback: WordPress + NAVT エラー対策 « こなきの’ドンマイ10%’

  3. Pingback: ナビゲーションメニューを変更するには | wordpress カスタマイズメモ

  4. はじめまして、つい最近ワードプレスを始めたばかりの初心者ですが質問させてください。

    当方、ヘッダーにメニューバーがないテーマ(テンプレート)を導入しており、ヘッダーにメニューを入れたかったので、こちらのページに紹介されているNAVTを入れてみました。

    こちらのページの通りにheader.phpに追記してなんとか表示されたのですが、ヘッダーの右下に縦に並んだ状態で表示されてしまっております。
    もともとスタイルシートに表示用の記述がないので、どういうふうに記述したらいいのか分かりません。

    大変恐れ入りますがスタイルシートへはどのように追記したらよろしいのでしょうか?
    初歩的な質問で申し訳ございませんがよろしご教授ください。

    ishi

Comments are closed.