固定ページで任意のカテゴリーのタグをリスト化(五十音順)で表示したい

Simplicityの特徴 › フォーラム › テーマファイルのカスタマイズに関する質問など › 固定ページで任意のカテゴリーのタグをリスト化(五十音順)で表示したい

  • このトピックには32件の返信、2人の参加者があり、最後にインパラにより10年、 5ヶ月前に更新されました。
32件の返信スレッドを表示中
  • 投稿者
    投稿
    • #40135
      インパラ
      ゲスト

      固定ページで任意のカテゴリーのタグをリスト化(五十音順)で表示したりできますか?

      カテゴリーで「車のメーカー」があります(トヨタ、日産、三菱‥)。それぞれのメーカーは

      タグで車種名を分けています(トヨタならランクル、カローラなど)。

      どの車種の記事があるかわかりにくいと言われ、次のようにしてみたいです。

      グローバルメニューでメーカー(トヨタ、日産など)を作りページに進むとそのメーカーの車種名(タグでわけた車種名)が

      五十音順にならんでいるような感じです。

      わかりにくいかもしれませんが

      このようなことはできますか?

    • #40161
      アバター画像わいひら
      キーマスター

      申し訳ないですが、上の説明では、どのようなことをしたいのかが、よくわからないです。

    • #40175
      インパラ
      ゲスト

      大変失礼しました。

      うまく説明できなくて。

      似たような記事を見つけたのでそちらを参考にしながらチャレンジしてみます。

    • #40197
      Hidekichi
      ゲスト

      get_categories($array)等で、orderbyをname、orderをascにしたら五十音かと思いますけれども…。

    • #40212
      インパラ
      ゲスト

      お世話になっております。

      説明が下手でお二人にご迷惑おかけしてすみません。

      以前Hidekichiさんに教えていただいた「任意の固定ページにカテゴリーを一覧(全部)表示」で

      例えば、一覧の中に「車」というカテゴリーがあったとします。それを押すと

      タグがリスト化で一覧表示(五十音順)できるっといった感じです。

      やはりわかりにくいですよね?

    • #40216
      がちょぴん
      ゲスト

      WP(WordPress)には、プラグインという拡張機能があり、
      数えきれないほどのプラグインが日々登録されているので、
      インパラさんが求めている機能もプラグインとしてあるかもしれないです。

    • #40218
      Hidekichi
      ゲスト

      あぁ、これですかね?

      get_terms()を見ると、カテゴリの表示順も設定できるようです。
      いろいろ試してもらう必要がありますが、

      $cats = get_terms( 'category', 'get=all' );

      これを、

      $cats = get_terms( array{
       'taxonomy' => 'category',
       'orderby' => 'name',
       'order' => 'asc'
      } );

      とかでイケるんじゃないですかね?試してないんでわかりませんが。

    • #40219
      Hidekichi
      ゲスト

      それと、前に投稿したり答えたりしたことがあるトピックはできるだけ引用して下さい(笑)
      どれか探すのを戸惑ったりするので。linkの貼り方は普通のwordpressと同様です。範囲指定してlinkボタンを押せばウィンドウが表示されるので、そこに必要項目を入れるだけの簡単設定です。

    • #40220
      インパラ
      ゲスト

      お世話になっております。

      トピックの件、気を付けます。

      早速、(文字列)を昇順にする?ですかね

      switch($type){
          	case "cat":
          		$cats = get_terms( array{  ←ここの部分ですよね?
                'taxonomy' => 'category',
                'orderby' => 'name',
                'order' => 'asc'
                 } );         
          		foreach($cats as $cat){
      				$out .= "<li><a>term_id                   ) ."'>". $cat->name ."</a>(".$cat->count.")</li>";

      このように書き換えるのですか?

    • #40221
      Hidekichi
      ゲスト

      そんな感じです。

    • #40222
      Hidekichi
      ゲスト

      ”
      これで直るか

    • #40223
      Hidekichi
      ゲスト

      これでどうだ。

    • #40224
      Hidekichi
      ゲスト

      こっちか。

    • #40225
      Hidekichi
      ゲスト

      ダメだ。わいひらさんを待つことにしよう(笑)

    • #40226
      インパラ
      ゲスト

      なんか表示が‥

      そのように書き換えるとエラーがでてですね

      コピペをしようとしましたが復旧を待ちます。

    • #40227
      Hidekichi
      ゲスト

      あぁ、やってもうてた(笑)

      array {} と書いてますが、 array() です。中括弧ではなくカッコでした。

    • #40228
      インパラ
      ゲスト

      エラーは消えました!

      中括弧に変更して表示すると

      記事数がゼロのカテゴリーは表示されず記事があるカテゴリーのみが表示される結果になりました。

      並び順は変わらずといった感じです。

    • #40229
      Hidekichi
      ゲスト

      これで上手く行くなら、リファレンスに従って必要な項目を追加していけばだいたい思うように表示されるかと。

      リファレンスにある、’hide_empty’ => false,がモロ「カラを消す=>いいえ」ということです。
      並び順が変わらない、というのは五十音になってないということですか?

      基本、数字、アルファベット、ひらがな、カタカナ、漢字みたいな順になると思いますが、カタカナの中で正しく並び順を変えるためには、カテゴリ名ではなく、スラッグを正しくつけて、それをソートする必要があるのではないかと思います。
      まぁ日本語の種類が多すぎるのが問題な所です。

      例えば、「toyota トヨタ」というカテゴリ名にすれば、普通にアルファベットで正しくソートできると思います。スラッグは、トヨタというのにtoyotaと当てるものですが、他で何かしらのスラッグが利用されていた場合は上手く動作しないかも。
      カテゴリの場合は、カテゴリーリンクにスラッグ設定欄があります。

    • #40230
      インパラ
      ゲスト

      ‘taxonomy’ => ‘category’,
      ‘orderby’ => ‘name’,
      ‘order’ => ‘asc’,
      ‘hide_empty’ => ‘false’ ←追加

      これでやってみます。

      それとスラッグ設定欄を見直してみます。

    • #40267
      インパラ
      ゲスト

      お世話になっております。

      スラッグ設定を見直してみたのですが五十音順にはならず。

      ‘hide_empty’ => ‘false’ ←追加 これも

      記事数が0のカテゴリは表示できずといった感じの結果になりました。

      五十音順にならないのは「他で何かしらのスラッグが利用されていた場合‥」

      探したのですが特に思い当たる所がなく‥

    • #40277
      Hidekichi
      ゲスト
      case "cat":
      	//$cats = get_terms( 'category', 'get=all' );
      	$cats = get_terms( "category",array(
      	"orderby" => "slug",
      	"order" => "asc",
      	"hide_empty" => 0,
      	"parent" => 0
      	));
      	if ( ! empty( $terms ) && !is_wp_error( $terms ) ){
      		foreach($cats as $cat){
      			$out .= "<li class='categoty parent'><a href='". get_category_link( $cat->term_id ) ."'>". $cat->name ."</a>";
      			$out .= "<ul>";
      
      			$termchildren = get_term_children( $cat->term_id, $cat->taxonomy);
      			foreach ($termchildren as $child){
      				$term = get_term_by('id', $child, $cat->taxonomy);
      				$out .= "<li class='categoty child'><a href='". get_category_link( $term->term_id ) ."'>" . $term->name . "</a></li>";
      			}
      			$out .= "</ul></li>";
      		}
      	}
      	break;

      こんなんでどうですか?
      $catでget_termsをして、親だけ取得します。そのidから子を取得して、更にその配列からタームを取り出しリストにします。
      挙動が正しいのかどうかがわかりませんが、親はカテゴリーそのものだから良いとして、子もカテゴリーなので、例えば、

      親 トヨタ
      子 カローラ

      とあった場合、

      親 ドメイン名/category/toyota
      子 ドメイン名/category/toyota/callora ←スペルが正しい可動は不明(笑)

      このようになります。おそらく、子にクラウンとあった場合は、クラウンの年代ごとのページとか、モデルによる違いとかそういうページが一覧表示されるというならこれで良いかと。

      親にはクラスとしてcategory parent、子にはcategory childとつけてあるので、これらを何かしらブロックで囲んで、

      <div id="all-catlist">
      [ショートコード]
      </div>

      こんな感じで、cssには、

      #all-catlist .category.parent {
        なんちゃら
      }
      #all-catlist .category.child {
        なんちゃら
      }

      みたいな感じでスタイルにスタイルできるかと。.category.parentのように連続してあるものは、

      <div class="category parent"></div>
      このようなhtmlです。例えば

      #all-catlist .category {
        color: #f00;
      }

      とすれば、カテゴリーの部分だけ赤文字になるというような事ができます。

      #all-catlist .parent {
        font-size: 18px;
      }

      などとすれば、親だけ18pxとかもできるという寸法です。

      tagの方はまぁ同じような感じでイケるんじゃなかろうかと。
      どういう挙動が正しいのかtagの方はわからなかったので、何もしてませんが、タグ一覧はいわゆるタグクラウドでもいいんじゃなかろうかとも思います。

    • #40278
      Hidekichi
      ゲスト

      × スペルが正しい可動は不明(笑)
      ◯ スペルが正しいかどうかは不明(笑)

    • #40279
      Hidekichi
      ゲスト

      あ、コピペミスってた。
      if ( ! empty( $terms ) && !is_wp_error( $terms ) ){

      は
      if ( ! empty( $cats ) && !is_wp_error( $cats ) ){
      です。

    • #40289
      インパラ
      ゲスト

      お世話になっております。

      「例えば、親 トヨタ 子 カローラ‥」ありがとうございます。

      自分の思い描いていた感じになりました!

      がしかし、記事数の表示が出てない(この場合表示はでないのですか?)

      あとやはり並びが五十音順にならないという結果です。

      更に質問を重ねて申し訳ないのですが子カテゴリだけを表示するのは可能ですか?

      例えばトヨタの子カテゴリだけを固定ページに表示(ここがまた説明が下手でわかりにくいかもです‥)

      次から次へとすいません。

    • #40338
      Hidekichi
      ゲスト

      > 記事数の表示が出てない(この場合表示はでないのですか?)

      記事数はウチにテスト環境がないので自身で試してもらいたいのですが、親ならget_terms()で拾ってる部分の返り値(スクリプト先頭にコメントアウトしてある内容)にcountが含まれてますから、その配列の返り値を展開している最初の$catで、$cat->countとして拾えると思います。

      なので、親が仮にトヨタの場合、「トヨタ(数値)」とする場合は、
      $out .= "<li class='categoty parent'><a href='". get_category_link( $cat->term_id ) ."'>". $cat->name ."(". $cat->count .")</a>";
      でいけるんじゃないかと。クォートを入れ間違え(入れ忘れ)しないように気をつけて下さい。

      この場合、トヨタのサブカテゴリを含む総数ということでしょうか。

      子の場合は、get_term_children()で親のidから関連する子の配列を作り、get_term_by()でそれらを検索しています。ここにもcountが含まれているので、親同様の形式で
      $out .= "<li class='categoty child'><a href='". get_category_link( $term->term_id ) ."'>" . $term->name . "('". $term->count .")</a></li>";

      とすればいけるんじゃないかなと思います。

      > 質問を重ねて申し訳ないのですが子カテゴリだけを表示するのは可能ですか?

      むしろそうした方が良いのではなかろうかと、上記スクリプトを書いてる時に思っていたのですが、それなら、

      function test($attr) {
      	extract(shortcode_atts(array(
              'type' => 'cat',
              'target' => ''
          ), $attr));
      	
      	$out = "";
      	$out .= $type;
      	$out .= "<ul>";
      	
      	switch($type){
      		case "cat":
      			if ( ! empty($target) ){
      				$cats = get_terms( "category",array(
      					"hide_empty" => 0,
      					"parent" => 0) );
      				if ( ! empty( $cats ) && !is_wp_error( $cats ) ){
      					
      					foreach($cats as $cat) {
      						if ( $cat->name == $target ) {
      							$out .= "<li class='categoty parent'><a href='". get_category_link( $cat->term_id ) ."'>". $cat->name ."</a>";
      							$out .= "<ul>";
      							$termchildren = get_term_children( $cat->term_id, $cat->taxonomy);
      							
      							$childinfo = array();
      							foreach ($termchildren as $child){
      								$term = get_term_by('id', $child, $cat->taxonomy);
      								$childinfo[] = array( "slug" => $term->slug, "name" => $term->name, "id" => $term->term_id );
      								
      							}
      							asort($childinfo);
      							foreach($childinfo as $child) {
      								$out .= "<li class='categoty child'><a href='". get_category_link( $child['id'] ) ."'>" . $child['name'] . "</a></li>";
      							}
      							$out .= "</ul></li>";
      							
      						} 
      					}
      					
      				}
      				
      			}

      targetと言うのを増やして、ショートコードでは、
      [getterm type="cat" target="トヨタ"]
      のような感じで使います。

      途中で$childinfoという配列を作り、get_term_by()で取得した内容から、必要なslugとname、idを配列に収納し、asort()でソートしてます。こうやってスパゲティコードというのは生み出されていくんですね(笑)
      まぁひとまず表示できればokならこんな感じかなぁと。

      おそらくもっとサックリとイケると思うんですよ。他にもwordpressの関数はあるでしょうし。そこらは色々と探しつつ洗練していくのが良いかと思います。

    • #40339
      Hidekichi
      ゲスト

      あんまりかわりませんが、

      function test($attr) {
      	extract(shortcode_atts(array(
              'type' => 'category',
              'target' => ''
          ), $attr));
          
          (isset($target)) ? $catId = get_cat_ID($target) : $catId = null;
          
          $out = "";
          $out .= "<ul>";
          
      	switch($type) {
      		case "category":
      		    if ($catId) {
      		    	$children = get_term_children( $catId, $type);
      		    	$childinfo = array();
      		    	
      		    	$out .= "<li class='categoty parent'><a href='". get_category_link( $catId ) ."'>" . $target . "</a>";
      		    	$out .= "<ul>";
      		    	
      		    	foreach($children as $child) {
      		    		$term = get_term_by('id', $child, $type);
      		    		$childinfo[] = array( "slug" => $term->slug, "name" => $term->name, "id" => $term->term_id );
      		    	}
      		    	
      		    	asort($childinfo);
      				foreach($childinfo as $child) {
      					$out .= "<li class='categoty child'><a href='". get_category_link( $child['id'] ) ."'>" . $child['name'] . "</a></li>";
      				}
      				$out .= "</ul></li>";
      		    	
      		    } else {
      		    	$out .= "<li>".$target."のIDが見つかりませんでした</li>";
      		    }
      		    
      		    break;
      	}
      	
          $out .= "</ul>";
      	
      	return $out;
      }
      
      add_shortcode('catlist', 'test');

      使い方としてはこんな感じにできます。

      <div class="catlist">
      [catlist target="トヨタ"]
      </div>

      変更点は、
      $cats = get_terms( “category”,array(“hide_empty” => 0, “parent” => 0) );
      でやってたのをget_cat_ID($target)で直接親のidを見つけるようにしたのと、仮にショートコードのtarget=”何かしらメーカー名”からidが拾えなかった場合に、「見つかりませんと」表示するようにしました。

      カテゴリーの方はこんな感じでしょうか。

    • #40340
      Hidekichi
      ゲスト

      cssを当ててない表示例とhtmlのソースはこんな感じです。

    • #40346
      Hidekichi
      ゲスト

      更に短くしてみた。

      function test($attr) {
      	extract(shortcode_atts(array(
              'type' => 'category',
              'target' => ''
          ), $attr));
          
          (isset($target)) ? $catId = get_cat_ID($target) : $catId = null;
          
          $out = "";
          $out .= "<ul>";
          
          if ( $type == "category" ){
          	
      	    if ($catId) {
      	    	
      	    	$out .= "<li class='categoty parent'>"
      	    			."<a href='". get_category_link( $catId ) ."'>" . $target . "</a>";
      	    	$out .= "<ul>";
      	    	
      	    	$args = array(
      	    		'orderby' => "slug",
      	    		'order' => "ASC",
      	    		'child_of' => $catId,
      	    		'pad_counts' => true,
      	    		'hide_empty' => 0
      	    	
      	    	);
      	    	$children =  get_categories( $args );
      	    	
      	    	foreach($children as $child) {
      	    		$out .= "<li class='categoty child'>"
      	    				."<a href='". get_category_link( $child->term_id ) ."'>"
      	    				. $child->name
      	    				."<span class='count'>(". $child->count .")</span>"
      	    				."</a></li>";
      	    	}
      	    	
      			$out .= "</ul></li>";
      			
      	    } else {
      	    	$out .= "<li>".$target."のIDが見つかりませんでした</li>";
      	    }
      		    
      	}
      	
          $out .= "</ul>";
      	
      	return $out;
      }
      
      add_shortcode('catlist', 'test');
      <div class="catlist">
      [catlist target="トヨタ"]
      </div>
    • #40347
      Hidekichi
      ゲスト

      折角短くしたのに、$argsと出力の部分をわかりやすくするために別にしたことが裏目に出てほとんど変わらないかちょっと増えた感があるという(笑)

    • #40362
      インパラ
      ゲスト

      お世話になっております。

      無事にできました!!

      納得いく表示ができ感謝しております。

      ならないと言っていた「五十音順と記事数」もできました。

      「正しく並び順を変えるためには、カテゴリ名ではなく、スラッグを正しくつけて、それをソート‥」

      ↑ 指摘されてあった通りスラッグをカタカナで統一。そうすれば名前は漢字、平仮名であっても五十音順に並びました。

      このあたりを勘違いしていたのもあり大変為になりました。

      あと、すいません例えば
      ・トヨタ   ←ここを消すもしくは非表示など
          ・カローラ
          ・クラウン
          ・エスティマ
          ・Rav4

      は可能ですか?

    • #40385
      Hidekichi
      ゲスト
      $out .= "<li class='categoty parent'>"
      	."<a href='". get_category_link( $catId ) ."'>" . $target . "</a>";
      $out .= "<ul>";

      上記を取り除いて、

      $out .= "</ul></li>";
      も取り除きます。で、

      $out .= "<li class='categoty child'>"
      が子のカテゴリを表示してますが、特にchildは必要ないので、childを取り除き、.categoryは他でも使われていると思いますので変更するか、必ず、

      <div class="catlist">
      [catlist target="トヨタ"]
      </div>

      このような形式で何かしらの子要素にするのであれば.categoryでも問題ないかと思います。もしcssでスタイルする際に、上記のショートコードなら、

      .catlist ul {
        //なんちゃら
      }
      .catlist li {
        //なんちゃら
      }

      こんなふうにするのであればclass(.category及び.child)自体も不要です。これらclassを入れたのは親と子のカテゴリーの表示を文字サイズや色で見分けるためにスタイルしやすくできるように入れてあるだけなので。

      ■classを無くした場合のlist表示部分。

      foreach($children as $child) {
          	$out .= "<li><a href='". get_category_link( $child->term_id ) ."'>" . $child->name ." (". $child->count .")</a></li>";
      }

      ソートの部分は、wordpressに限らず日本語環境ならどのプログラムでもソフトでも同じようなことが言えるかと思います。excelとか(もうずいぶんと触ってませんが)、でもそうじゃないかなぁと。簡単操作するために色々とやってるかも知れませんが、基本的にローマ字に直したり、人間がみて順番を意図的に変えたりしてますよね。
      人名とか本当に面倒くさいんですよ。漢数字で一〜十まで並べるようにしてあったとしても、九十九(つくも)さんとかいたら上の方に表示されるでしょう?「つ」だよ、「つ」と漏らすんです(笑)

      スラッグの部分は、こういうのもあるので、カタカナで統一するというのは良い案です。ただし、ここらはおそらく修正されているかと思うので問題ないと思いますが、一部環境下ではカタカナも怪しいのでアルファベット表記(でローマ字とか)が一番日本語をソートするには正しいかと思います。
      ただ、ここも例えばレビンと入れる時に初めが「L」なのか「R」なのかで順番が変わるのでやはり人間の管理が必要なんですよね。

    • #40386
      Hidekichi
      ゲスト

      △ 簡単操作するために色々とやってるかも知れませんが
      ◯ 簡単操作するためにソフト側で色々とやってるかも知れませんが

    • #40405
      インパラ
      ゲスト

      ありがとうございます!

      無事出来ました。

      「.catlist ul .catlist liをcssでスタイルする」

      ↑ 丁寧にありがとうございます。

      今回、ソートの部分で日本語の問題点、気を付けることなど意外な部分まで勉強でき

      ありがとうございました。

32件の返信スレッドを表示中
  • トピック「固定ページで任意のカテゴリーのタグをリスト化(五十音順)で表示したい」には新しい返信をつけることはできません。
スポンサーリンク
アドセンス(大)
アドセンス(大)