完璧な垂直メニューの探求...
第1回チュートリアルのこのメニューを入れ子になった水平マルチレベル構築のステップバイステップのプロセスで説明Wordpressの論文のテーマ 。 パート2では、この機能を強化する上で続行されます。 水平方向のナビゲーションメニューのここでは、追加されます"暗い"バージョンと私がどのように"明るい"と"暗い"のバージョンを切り替えることをお教えします。 パート2はパート1のスーパーセットです。 これは、すべてのパーツから1 +はクールな追加が含まれます。
メインのアイディアは、私が提示したいというメニューを追加する垂直論文のテーマに一般的なワードプレスと（）。 私は無制限のネストレベルを作成できるようになる本当に柔軟、SEOのマルチブラウザに優しい対応垂直メニューを探していた。
WEBは、しかし、私はこれらのすべてのサンプルをtryし始めた件名ページのトンがある - これらは、apart落ち、ダウン破ったlevels限られた数をsupported orゲイツ+バルマー's junksplorer 6 in殴りかかった。 最後に私が試したんに戻ると信頼ダイナミックドライブメニューを要件としての垂直方向の厳しい私に収まるなケースのサンプルが証明すること。 私は大幅にかかわらず、それは論文のモデルを確実に収まるようにそれらを変更しなければならなかった。
完璧探求は続く...
私は検索、組立、テスト、修正、研磨を約16時間を過ごし、垂直方向のメニューのCSSを調整と。jsファイルのコードと3 / 4の時間ははMSIE 6で動作することに費やされた。
とにかく、私は幸せ最終的な結果となった。 因子に垂直ナビゲーションメニューがあるすべてのと同じ利点を水平メニューがあります。
能力を垂直メニューを追加することは非常にポータルの約70〜80％に、ウェブ上で重要です。 横長のメニューは、"空間"が多くのメニューの選択肢に対応する垂直メニューはこのような制限を持っていないと非常に役立つだろう限られている。 だからここに行く。
手順の多くは説明する達していること、それが起こるのチュートリアル1部 1つの短いビットのためにので、このようれますが、機能と多くより豊かな結果を示す。
だからここでは行く：
建物は、SEOフレンドリー、垂直、マルチレベル、階層とWordpressのためのネストされたメニューを論文のテーマ 。 ステップバイステップ
（...何を考えたことのない...）
- インストール幹部phpのプラグインは 、それをアクティブにします。 私は、テキストウィジェット内のHTMLコードを垂直メニューを'出力するPHPを使用するため、我々はそれが必要になります。
- からか手順1 6 - のチュートリアル1部 。 基本的にはインストールして使用NAVTプラグインを有効にする必要が視覚的にメニューを作成する検索する。 メニューのグループ名が'であることを確認menu1'。 この名前は、custom_functions.phpにハードコードされ
- をクリックして'ギア'アイコンをあなたの'menu1'グループのプロパティをそれをの編集：
- に従う7.1 -7.3パート1の"オプション"、"表示"と"CSSの"タブの設定を設定するにはチュートリアルの手順。
- このダイアログの"テーマ"タブをクリック。 あなたがステップ1次されている場合私たちは（）の設定の数を上書きされます。 これはOKです - あなたは何かを失うことはありません - しかし私は、手順1からいくつかのコードを変更したため、これらの変更が必要です。
ここではどのようにこのダイアログで入力する必要がありますです：- それは）これらのクラスを任意のタグを置き換えるためにコマンドを次のコードを入力します（テーマのxpath"の内側："エリア：
.jquerycssmenu, .jqueryslidemenu - 設定"アクション"は"と"置換する方法
- ナビゲーショングループ"タグを追加するの内部の前に"エリアにはこのコードを入力してください：
<div class='jquerycssmenu' style='margin-top:5px;'> - ナビゲーショングループ"タグを追加するの内部後に"エリアにはこのコードを入力してください：
<br style='clear: left' /></div> - をクリックして[上/]ボタンを閉じて保存します。
- それは）これらのクラスを任意のタグを置き換えるためにコマンドを次のコードを入力します（テーマのxpath"の内側："エリア：
- 今Wordpressの管理者パネルに行く - >外観 - >ウィジェット。
- 右側の"サイドバー1"領域に大きな"利用可能なウィジェット"エリアからドラッグ"テキスト"ウィジェット（）。 我々は、我々は、垂直メニューを実現するのに役立ちますテキストウィジェットにコードを追加されます。
存在注：私はあなたが推定"サイドバー"1。 論文のオプションは、あなたがそれをオフにすることができます - しかし、このチュートリアルで聞かせてそれはmakeのために。 - したら、ドラッグし、このウィジェットを削除 - それは意志が私はロマンチックな今ではMSIE闘争を超えている感じています花（のように表示されます）。
- "タイトル"領域では"世界最高の垂直方向のメニューを"と入力...さて、あなたの生まれたばかりの垂直方向のメニューの上に行くあなたの創造性を - テキストを使用する自由。
- テキストの大きな領域 - このPHPコードを入力してください：
<?php
if (function_exists('navt_getlist'))
$menu_html = navt_getlist ('menu1', false, '', 'ul id="dd_vertical"');
else
$menu_html = "";
$menu_html = preg_replace ('#class=[\'\"]jquery(css|slide)menu[\'\"]#', 'class="dd_vertical"', $menu_html);
echo $menu_html;
?> - を押して[保存]ボタンをクリック、"閉じる"リンクをクリックします。
- ダウンロードはこちらのファイルセットを更新した 。
このアーカイブには含まれています：- "明るい"水平メニューコードの更新版
- 水平メニューの"ダーク"バージョン
- 垂直メニューコード
- custom_functions.phpの更新版
- 今すぐあなたのこの解凍が必要にアーカイブをのディレクトリ'アップロード、それをにカスタム'論文のテーマです。
注：あなたがcustom_functions.php内の任意のカスタマイズを行っている場合 - は、それらをマージする必要がありますね。 れていない場合は - 私のバージョンでそれを上書きすること自由に感じ。 - 出来上がり！ 今すぐあなたのウェブサイトを再読み込みされると左側のサイドバーで同じ"明るい"水平メニューは+格好いい垂直メニューを参照してください。
- ボーナスタスクは："暗い"のカラースキームに変更"明るい"水平メニューをみましょう。
- custom_functions.phpファイル内：
このコードを置き換えます：
echo "<div class=\"jquerycssmenu\">$menu_html</div>"; // "Bright" menu
//echo "<div class=\"jqueryslidemenu\">$menu_html</div>"; // "Dark" menu
このコードで：
//echo "<div class=\"jquerycssmenu\">$menu_html</div>"; // "Bright" menu
echo "<div class=\"jqueryslidemenu\">$menu_html</div>"; // "Dark" menu
基本的に我々は1つの行をコメントアウトされ、他の1つのコメントを解除。 - 今Wordpressの管理->ツール - > NAVTリストと上記の"歯車をクリックしてください"アイコンがあなた'menu1'グループのプロパティを編集します。
- クリックして"テーマ"タブをクリックします。
- ナビゲーショングループ"タグを追加するの内部の前に"エリアにはこのコードを入力してください：
<div class='jqueryslidemenu' style='margin-top:5px;'> - 今 - あなたのページをリロード - そしてあなたの主な水平方向のナビゲーションメニューの"魔法のように"暗い、似たようなことになった：
論文のテーマ -マルチレベルネストされたCSSのメニュー-暗いパレット
ダークカラーパレットは、より多くの光の色のいずれかよりも、特定のサイトに適していることがあります。 だから今あなたの人生の選択の自由がある！
- 戻って"明るい"配色 - 単に"ボーナス"上記の手順を元に戻す取得します。
- custom_functions.phpファイル内：
- 結論：
私の大好きな論文のテーマを 、私はWordpressを愛し、私は、ポータルに私達の大好きメニューを事実をナビゲーションまともな方法を追加する我々がいる。
$ 20
をお楽しみください！
グレープEsman
comments } （ 5コメント ）
