Q&A
コードはコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。また、拡大に使うJavaScriptなどが書かれていないようですが、どのような実装にされる予定でしょうか。
###前提・実現したいこと
wordpressでギャラリーページのようなものを作成しています。
下記ページを参考に投稿一覧画像から、クリックするとlightboxのように画像を拡大するようにしたいのですが、その投稿をカテゴリ別に分けたいのですが、うまくいきません。
ご教授いただけるとありがたいです。
###発生している問題・エラーメッセージ
現在、フォーマットは表示されるのですが要素は何も表示されません。
###該当のソースコード
■loop-performance .php
<?php query_posts('post_type=performance&showposts=-1'); ?> <?php if(have_posts()): while(have_posts()): the_post(); ?> <?php if (get_post_thumbnail_id()): ?> <li> <?php $src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID) ,'full'); ?> <a rel="gallery" href="<?php echo $src[0]; ?>" > <?php the_post_thumbnail(array(144,144));?></a> </li> <?php endif; ?> <?php endwhile; endif; ?> <?php wp_reset_postdata(); wp_reset_query(); ?>
■archive-performance.php
<?php get_header(); ?> <!-- contenst --> <div id="contents"> <div id="dt_box01"> <h3>WORKS</h3> </div> <section> <div id="works_2nd"> <div id="works_nv"> <ul> <li><a href="http://sasageya.co.jp/imgsol/wordpress/performance/fashion/"><img src="<?php echo get_template_directory_uri(); ?>/images/works_snv01.png"></a></li> <li><a href="http://sasageya.co.jp/imgsol/wordpress/performance/food/"><img src="<?php echo get_template_directory_uri(); ?>/images/works_snv02.png"></a></li> <li><a href="http://sasageya.co.jp/imgsol/wordpress/performance/live/"><img src="<?php echo get_template_directory_uri(); ?>/images/works_snv03.png"></a></li> </ul> </div> <div id="works_dt"> <ul class="works_lst"> <?php get_template_part('loop', 'performance'); ?> </ul> </div> </div> </section> </div> <!-- /contenst --> <?php get_footer(); ?>
■taxonomy.php
<?php get_header(); ?> <!-- contenst --> <div id="contents"> <div id="dt_box01"> <h3>WORKS</h3> </div> <section> <div id="works_2nd"> <div id="works_nv"> <ul> <li><a href="http://sasageya.co.jp/imgsol/wordpress/performance/fashion/"><img src="<?php echo get_template_directory_uri(); ?>/images/works_snv01.png"></a></li> <li><a href="http://sasageya.co.jp/imgsol/wordpress/performance/food/"><img src="<?php echo get_template_directory_uri(); ?>/images/works_snv02.png"></a></li> <li><a href="http://sasageya.co.jp/imgsol/wordpress/performance/live/"><img src="<?php echo get_template_directory_uri(); ?>/images/works_snv03.png"></a></li> </ul> </div> <div id="works_dt"> <ul class="works_lst"> <?php get_template_part('loop', 'performance' ); ?> </ul> </div> </div> </section> </div> <!-- /contenst --> <?php get_footer(); ?>
■functions.php
<?php // ウィジェット register_sidebar(); register_sidebar( array( 'name' => __( 'サイドバー2', 'imgsol' ), 'id' => 'sidebar-2', 'description' => __( '新規で追加したウィジェットです', 'imgsol' ), 'before_widget' => '<aside id="%1$s" class="widget %2$s">', 'after_widget' => '</aside>', 'before_title' => '<h3 class="widget-title">', 'after_title' => '</h3>', ) ); /** * アイキャッチ画像を使用可能にする */ add_theme_support( 'post-thumbnails' ); add_image_size(144,144,true); add_action( 'pre_get_posts', 'my_pre_get_posts' ); function my_pre_get_posts($query) { // 管理画面、メインクエリ以外には設定しない if ( is_admin() || ! $query->is_main_query() ){ return; } //トップページの場合 if ( $query->is_home() ) { $query->set( 'posts_per_page', 3 ); return; } } //カスタムポストタイプ(写真)の追加 register_post_type( 'performance', array( 'label' => '実績', 'public' => true, 'supports' => array( 'title', 'editor', 'author', 'thumbnail', 'excerpt', 'custom-fields' ,'comments' ), 'menu_position' => 5, 'has_archive' => true ) );
###試したこと
いろいろいじっていたら、アイキャッチ画像一覧も表示されなくなってしまったので現在はこの状態です。
function.phpのカテゴリタクソノミー追加もうまくいかなかったので現在はその部分は削除しています。
早速ご連絡いただきありがとうございます。
コード部分をコードブロックにしました。
javascriptなんですが、文字量の制限にひっかかってしまい入力できないようです。
http://dainashiyesterday.com/post-2563/
に掲載しているJavaScriptを使用しています。
どうぞ宜しくお願いいたします。
loop-performance.phpのファイル名のつづりに間違いがあり、現在は要素（今は3つ）が表示されるようになりました。
ここから左の3つのメニューごとに要素をカテゴライズしたいのですがうまくいきません。
現在はこんな感じです。
http://sasageya.co.jp/imgsol/wordpress/performance/
カスタムタクソノミーを設定されていますか？それ無しにどのようにカスタム投稿タイプを分類されているのでしょうか。カスタムフィールドですか？
ご返信有難うございます。
仕様の変更により、何とかこの部分はカテゴライズせずに独立させることでクリアすることができたのですが、このページをアダプティブで作成しておりまして、スマホサイズになったときのlightboxによる拡大表示が表示させたときに画面をはみだしてしまいます。
画面幅100％で拡大画像を表示させるにはどうしたらよいでしょうか？
すいません。自己解決できました。
有難うございました。
カテゴライズしないなら、ひとまず別の質問になります。回答欄に事情を書いて一度解決済にされたうえで、別途質問されるのが良いと思います。JavaScript部分とライブラリ（Colorbox）についてどのように使っているのか（特にjQuery部分）がわかるように書かれていれば、回答も付くと思います。
あ、自己解決されたのですね。
自己解決
