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

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

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

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

Q&A

0回答

387閲覧

カスタム投稿タイプのタブ毎出力について

oyashiro

総合スコア37

WordPress

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

0グッド

0クリップ

投稿2018/04/05 05:11

wordpressでカスタム投稿タイプの投稿をタブ切り替え出来る一覧ページを作ってます。
とある記事で、それらしい記述を見つけやっているのですが、
中身が出力されません。

function.php

function tab_portfolio_list($custom_post1, $custom_genre2, $custom_genre3, $custom_term4) { $cnt = 0; $taxonomies = get_terms($custom_genre2); if( !is_wp_error($taxonomies) && count($taxonomies) ) { ?> <script type="text/javascript"> (function($) { $(document).ready(function() { $('.tab_area:first').show(); $('.tab li:first').addClass('active'); $('.tab li').click(function() { $('.tab li').removeClass('active'); $(this).addClass('active'); $('.tab_area').hide(); $(jQuery(this).find('a').attr('href')).fadeIn(); return false; }); }); })(jQuery); </script> <style type="text/css"> ul.tab li { float: left; background: #fff; border: #f0f0f0 1px solid; color: #2c699f; padding: 1em; width: 10em; font-size: 1.3em; font-weight: bold; } ul.tab li.active { background: #2c699f; } ul.tab li.active a { color: #fff; font-weight: bold; } ul.tab li.active a:hover { color: #f0f0f0; font-weight: bold; } ul.tab li:hover { background: #2c699f; } ul.tab li:hover a { color: #fff; } .tab_area{ display: none; } .tab_content{ width: 99%; clear: both; overflow: hidden; border: #f0f0f0 1px solid; padding: 1em 0 0 0; min-height: 140px; } .tab_content ul li { clear: both; background: #f8f8f8; padding: 1em 2em 1em 2em; margin: 0 1em 1em 1em; } .tab_content ul li img{ float: left; /*margin: 0 10px 10px 0;*/ } </style> <ul class="tab"> <?php foreach ( $taxonomies as $taxonomy ) { $cnt++; echo '<li><a href="#tab' . $cnt . '">' . $taxonomy->name . '</a></li>'; } ?> </ul> <div class="tab_content"> <?php $cnt = 0; foreach ($taxonomies as $taxonomy ) { $cnt++; ?> <div class="tab_area" id="tab<?php echo $cnt; ?>"> <?php $args = array( 'posts_per_page' => -1, 'post_type' => $custom_post1, 'tax_query' => array( array( 'taxonomy' => $custom_genre2, 'field' => 'term_id', 'terms' => $taxonomy->term_id ), array( 'taxonomy' => $custom_genre3, 'field' => 'slug', 'terms' => $custom_term4 ), 'relation' => 'AND' ), 'post_status' => 'publish' ); query_posts( $args ); print_r($args); if( have_posts() ) { ?> <ul> <?php while( have_posts() ) { the_post(); $portfolio_thumb = wp_get_attachment_image_src(get_post_thumbnail_id(), 'portfolio-thumb'); ?> <li class="clearfix"> <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" class="search-portfolio-thumb"><img src="<?php echo $portfolio_thumb[0]; ?>" height="<?php echo $portfolio_thumb[2]; ?>" width="<?php echo $portfolio_thumb[1]; ?>" alt="<?php echo the_title(); ?>" class="alighleft" /></a> <h4><a href="<?php the_permalink(' ') ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h4> <p><?php the_excerpt(''); ?></p> <?php the_excerpt_max_charlength(50); ?><a href="<?php the_permalink(' ') ?>" title="<?php the_title(); ?>" class="css_btn_class"><?php _e("<!--:en-->Read More<!--:--><!--:ja-->続きを読む<!--:-->"); ?></a> </li> <?php } ?> </ul> <?php } wp_reset_query(); ?> </div><!-- // tab_area --> <?php } ?> </div><!-- // tab_content --> <?php } }

front-page.php

<?php tab_portfolio_list( 'product-list','genre','item_genre','original' ); ?>

カスタム投稿タイプはCPT UIプラグインをつかってます。
他の設定は添付画像です。

イメージ説明
イメージ説明

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

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

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

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

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

stampdoor

2018/04/08 06:02

添付画像見た限りproduct-list→product_listではないですか?
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問