質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Q&A

解決済

1回答

1363閲覧

Wordpressで子カテゴリ一覧 (サムネイル画像付き) で表示させたい

ArSi

総合スコア13

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

0グッド

0クリップ

投稿2018/09/18 12:09

編集2018/09/18 12:48

前提・実現したいこと

wordpress歴、PHP歴ともに2週間程度の完全初心者です。
wordpress よりも PHP の方がフワッとしてます。
自分の力量で理想に追いつかない部分はあります。
かなり無茶な質問ですがお助けいただけるとありがたいです。

現在、wordpress でカテゴリーページを作ってるのですが
ホームの「親カテゴリ」をクリックするとその下の「子カテゴリ」一覧を作りたいと考えてます。

そして、それぞれに子カテゴリの最新記事のアイキャッチを使った子カテゴリ一覧を表示させたいです。


(カテゴリーページのイメージ)

カテゴリー:A(親)

<ul> <li><a>aaa(子)</a></li> ■■■■■ <li><a>bbb(子)</a></li> ■■■■■ <li><a>ccc(子)</a></li> ■■■■■ </ul> ※ ■はサムネイル画像

サムネイル画像をクリックするとその記事に飛び、
子カテゴリー名をクリックすると、その子カテゴリーに所属する記事の一覧が出るようにしたいです。

下記は stackoverflow や様々なブログを調べた結果のコードです。

該当のソースコード

PHP

1<ul> 2<?php 3/* 現在のカテゴリ-の取得 */ 4$cat_now = get_the_category(); 5$cat_now = $cat_now[0]; 6/*親カテゴリーのID取得*/ 7$parent_id = $cat_now->category_parent; 8 9?> 10<?php $childCats = get_categories("title_li=&child_of=$parent_id"); ?> 11 12 13 <?php 14 15foreach($childCats as $childCat) { 16 17 echo '<li><a href="' . esc_url(get_term_link($childCat, $childCat->taxonomy)) . '">' . $childCat->name . '</a></li>'; 18 } 19?> 20</ul>

かなり愚かな質問をしてることを承知しております。
よろしくおねがいします!

補足情報

使用してるWPバージョンとテーマは
WordPress 4.9.8 (XeoryExtension テーマ)
です。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kei344

2018/09/18 12:31

WordPressのカテゴリにはサムネイルがありませんが、その点はどう処理されるのでしょうか。
ArSi

2018/09/18 12:36

説明不足ですみません! それぞれの「子カテゴリー」が属する記事のアイキャッチを並べたいのです。 foreach内にそのコードを書くんじゃないかと踏んでるのですが…最初の変数の時点で躓いてるのかもしれません…
kei344

2018/09/18 12:42

「子カテゴリ毎の記事一覧」ですか?「子カテゴリの最新記事のアイキャッチを使った子カテゴリ一覧」ですか?質問文は編集できますので、本文に追記することをお勧めします。
ArSi

2018/09/18 12:44

ありがとうございます。
ArSi

2018/09/18 12:46

すみません、「子カテゴリの最新記事のアイキャッチを使った子カテゴリ一覧」の方で考えております。ちょっとこういうの初めてで色々すみません。質問文を編集します。
guest

回答1

0

ベストアンサー

カテゴリーアーカイブを表示しているときは、$cat に現在のカテゴリのIDが格納されているので、
それを利用して、get_term_children() で子カテゴリを取得できます。
子カテゴリが取得できれば、それは親カテゴリなので、取得できた子カテゴリの配列を利用して、foreachでループ開始、その中で、カテゴリ名やリンクを取得し、さらに、get_posts()で子カテゴリに属する記事を取得して、サムネイルなどを表示。
子カテゴリが取得できない場合、それはおそらく子カテゴリか子カテゴリを持たない親カテゴリなので、カテゴリーに属する記事の一覧を表示。
こんな感じの処理になるのかな、と思います。

書き方はあんまり上手くないので恐縮ですが、サンプルコードはこちらです。
(なんかもうちょっとシンプルな書き方があるのかもしれませんが・・・・)

2018.9.19 17時ごろ コメントに指摘のあったコードの間違いを修正しました

PHP

1<?php 2//$catに現在のカテゴリのIDが格納されている 3$this_cat_children = get_term_children( $cat, 'category' );//子カテゴリを取得する 4//var_dump($this_cat_children); 5 6if($this_cat_children): 7//子カテゴリがある=おそらく親カテゴリ の場合の処理 8foreach($this_cat_children as $children)://子カテゴリのループ開始 9$children_obj = get_category( $children );//子カテゴリの情報を取得 10//var_dump($children_obj); 11$name = $children_obj->cat_name;//カテゴリ名を取得 12$category_link = get_category_link( $children );//カテゴリへのリンクを取得 13//var_dump($category_link); 14?> 15<h3><a href="<?php echo $category_link;?>"><?php echo $name;?></a></h3> 16<ul> 17<?php 18$args = array( 19 'posts_per_page' => 5,//記事を表示する件数 全件の場合-1 20 'category' => $children 21 ); 22$myposts = get_posts( $args );//子カテゴリの記事を格納 23foreach ( $myposts as $post ) : setup_postdata( $post );//記事のループ開始 ?> 24 <li> 25 <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('thumbnail'); ?><?php the_title(); ?></a> 26 </li> 27<?php endforeach; //記事のループ終了 28wp_reset_postdata();?> 29 30</ul> 31 32<?php 33endforeach;//子カテゴリのループ終了 34 35else: 36//子カテゴリがない=子カテゴリか、もしくは子カテゴリを「持たない」親カテゴリ 37 38//記事があるかどうか 39if ( have_posts() ) : 40 41 echo '<ul>'; 42//ここからメインループ 43while ( have_posts() ) : 44the_post(); 45 46//記事を表示するコードなどなど 47?> 48 <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li> 49<?php 50endwhile; 51 echo '</ul>'; 52 53else : 54 55 56//記事がないときの処理 57 58endif; 59endif; 60?> 61

投稿2018/09/19 02:26

編集2018/09/19 23:54
marlboro_tata

総合スコア525

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

ArSi

2018/09/19 03:52

本当にありがとうございます! まさかこんな長くなると思ってなかったです汗 ちなみに <a href="$category_link"> を <a href="<?php echo $category_link;?>"> に変更したら完璧に理想の形になることができました。 コメントアウトの解説もとても丁寧で勉強の参考にもなりました! 感謝ですm(_ _)m ありがとうございます!
marlboro_tata

2018/09/19 07:56

あ、そうです、すみません、回答が間違いでした。
marlboro_tata

2018/09/19 07:59

回答の内容を直しておきましたm(_ _)m
ArSi

2018/09/19 09:06

すみません、大変恐縮なのですが、もう一つだけ質問があります。 <h3><a href="<?php echo $category_link;?>"><?php echo $name;?></a></h3> をクリックすると子カテゴリーの記事一覧を出したいのです。 最後から2,3行目に2つの [ endif; ] の間に該当する記事一覧を並べるコードが必要だと思いまして、色々試行錯誤してるのですが、なかなかうまく行きません汗 【自分が試してみたこと】 //記事がないときの処理 endif; $args=array( 'meta_query'=> array( 'relation'=>'OR' ), 'showposts'=>10, 'order'=>'DESC' ); $the_query = new WP_Query( $args ); // The Loop if ( $the_query->have_posts() ) { echo '<ul>'; while ( $the_query->have_posts() ) { $the_query->the_post(); echo '<li>' . get_the_title() . '</li>'; } echo '</ul>'; /* Restore original Post Data */ wp_reset_postdata(); } else { // no posts found } ?>       <?php endif; ?>
marlboro_tata

2018/09/19 23:57 編集

記述する場所が違うのと、 あとカテゴリアーカイブのページなので、new WP_Query()でクエリを作る必要はないです。 回答のコードの中で、 //ここからメインループ とある部分の while ( have_posts() ) :the_post(); から endwhile; が通常のカテゴリ一覧を出力できるループなので、 ここに記事一覧として出力したい内容を書けばOKです。
marlboro_tata

2018/09/20 00:00 編集

回答をまた少し直しておきました。差分は主に後半です。 (回答の日付の、編集の日付をクリックすると、過去の編集履歴が見られるんですね!すごーい!!)
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問