サポート » 使い方全般 » カテゴリーのドロップダウンメニューについて

  • 解決済 roses

    (@roses)


    カテゴリーのドロップダウンメニュー(wp_dropdown_categories)について質問です。

    運営サイトのカテゴリーが多いのでドロップダウンメニュー(wp_dropdown_categories)にしようと思っているのですが、子カテゴリーが多いのでCodexにあった下記のコードでは、セレクト項目が多すぎて一番下のカテゴリーを選択する時に不便なのです。

    親カテゴリーと子カテゴリーを別々のドロップダウンメニューにして2段階で選択できるようにするにはどうしたらよいのでしょうか?

    使用しているコード

    <form action="<?php bloginfo('url'); ?>" method="get">
    <?php wp_dropdown_categories('show_count=1&hierarchical=1'); ?>
    <input type="submit" name="submit" value="表示" />
    </form>

    希望する動作は

    1. ドロップダウンメニューを2つ並べ、1つ目のセレクトボックスで親カテゴリーを選択。
    2. 2つ目のセレクトボックスには先に選択した親カテゴリーに含まれる子カテゴリーのみを表示し、その中から選択。
    3. 表示ボタンでカテゴリーページへ移動。

    このようなものです。

    実現するのはかなり困難なのでしょうか?
    ご教授よろしくお願いいたします。

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • mick_ltc

    (@mick_ltc)

    結構厄介なような・・・
    phpでやるより、javaScriptでDOM書き換えた方がいいかもしれません。

    2階層までしか対応しませんが、試しに作ってみたので良かったら見てみてください。
    wp_dropdown_categoriesだと、カテゴリの階層構造が取得できないので、
    wp_list_categoriesでXHTMLのリストを書き出し、
    javaScriptでプルダウンに書き換えるました。

    http://test2.lunatic-code.net/

    トピック投稿者 roses

    (@roses)

    mick_ltc様

    ご回答ありがとうございます!

    >結構厄介なような・・・

    やはり、難しいことなのですね(汗)

    それなのにご親切にjavaScriptを作って頂けて感謝いたします。
    早速、お作り頂いたjavaScriptを設置すると無事動作いたしました。
    ありがとうございました!

    お作り頂けただけでもありがたいことなのに、お手間を取らせて申し訳ないのですが2つ質問があります。

    1つめの質問
    お作り頂いたjavaScriptだと2つめのセレクトボックスとボタンが後から表示されますが、始めから表示しておくことは可能でしょうか?
    サイトのレイアウトの都合上、始めから2つのセレクトボックスとボタンを表示しておきたいのです。

    2つめの質問
    wp_list_categoriesを使用しているので、wp_list_categoriesのパラメータを入れてみたのですが、プルダウンが解除されてしまいました。
    記事数の表示や並び順の指定などのパラメータは使えないのでしょうか?

    ご教授いただければ幸いです。
    よろしくお願いいたします。

    mick_ltc

    (@mick_ltc)

    1つ目:
    親用のプルダウンを作成している関数に、
    ダミーの子プルダウンとボタンを入れるものを追記すれば可能です。

    2つ目:
    ごめんなさい。
    オプションタグ閉じ忘れがあったので、それでどこか表示おかしかったかもしれません。
    並び順や件数の指定はできますがwp_dropdown_categoriesとwp_list_categoriesでは引数が若干違うので、確認してみてください。
    wp_list_categories(’orderby=ID&show_count=True′); ?>
    でID順、件数表示ありになります。
    プルダウンに件数は前回の時点では表示してません。

    上記2点改良したのを先日のサイトで動作させてますので、参考までにどうぞ。

    トピック投稿者 roses

    (@roses)

    mick_ltc様

    ご教授いただきありがとうございます。
    新しいjavaScriptを入れると思い通りの表示ができました!

    本当にありがとうございました:)

    wakakufu

    (@wakakufu)

    絞り込み検索の機能を探しておりこちらにたどりつきました。
    早速、試してみましたのですが、機能せず悩んでおります
    list.jsの設置がよくわからず以下のように行いましたが合っていますでしょうか?

    環境は、WP2.6.5にて、参考サイトを元に、
    ・sidebar.phpの変更
    ・header.phpの変更
    ・テーマ内に「js」フォルダを作成しlist.jsを入れる

    ご教授いただければ幸いです

    mick_ltc

    (@mick_ltc)

    wakakufuさん こんにちは。
    ソース見てみないとなんとも言えませんが・・・

    スクリプトはjQueryのあとにlist.jsの順番で読み込まれてますか?
    ↓の順番で書いてあればおkです。
    <script type=’text/javascript’ src=’http://hogehoge.net/wp-includes/js/jquery/jquery.js?ver=1.2.6′></script&gt;
    <script src=”http://hogehoge.net/wp-content/themes/テーマ/js/list.js&#8221; type=”text/javascript” charset=”utf-8″></script>

    もう一点。
    wp_list_categoriesの引数にtitle_liを設定していると、
    クラス名が自動で振られないので、このままだと動きません。

    あと、カテゴリは親子2階層しか考えてないので、3階層以上あると多分動きません。

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • トピック「カテゴリーのドロップダウンメニューについて」には新たに返信することはできません。