サポート » 使い方全般 » 親ページで属する子ページの最初の画像をギャラリー化する

  • 解決済 nsny

    (@nsny)


    お世話になります。
    当方、WordPressもPHPも素人なのでぜひ御教授いただければと思います。
    現在WordPress 2.8.5でCMSとしてサイトを作っております。
    タイトルの通りなのですが親ページに属する子ページそれぞれの最初の画像を読み込み、その親ページにてギャラリーのように表示したいのですが…
    現状ではこちらのフォーラムの「親ページに属する全子ページのタイトルと本文を表示」でありました、

    <?php
    if ( $post->post_parent == 0 ) {
    	$child_posts = get_posts( 'numberposts=-1&order=ASC&orderby=post_title&post_type=page&post_parent=' . $post->ID );
    	if ( $child_posts ) {
    		foreach ( $child_posts as $child ) {
    			$c_postname = $child->post_name ;
    			$c_content = get_extended( $child->post_content );
    			$c_content = apply_filters( 'the_content', $c_content['main'] );
    ?>
    
    <div id="<?php echo $c_postname; ?>">
    <?php echo $c_content; ?>
    </div>
    
    <?php
    		}
    	}
    }
    ?>

    を使用して、<!–more–> の前に画像を入れることで何とかやっていました。
    しかしながら検索で結果に抜粋を表示したいのでthe_excerptを使用しているのですがページでは何も表示されないのでthe_contentで<!–more–> を使用したくなったのですが、やはりそうすると先ほどの画像が表示されるだけですよね…
    なのでそれを一気に解決できるような方法はないでしょうか?
    できればその画像は大きさを設定でき(現状ではCSSで表示される画像の大きさを変えています)、テンプレートに挿入できればありがたいです。
    ヒントやコードがわかる方がいらしたらぜひ御教授下さい。

5件の返信を表示中 - 1 - 5件目 (全5件中)
  • トピック投稿者 nsny

    (@nsny)

    先ほどの質問の追記です。
    ギャラリー化する親ページではカスタムテンプレートを使用して、そのPHPファイルにその設定ができないかと思っております。
    また子ページからは画像とタイトルも取得できればうれしいです。
    上のコードのようにdiv等のHTMLソースをいじり易かったら最高です。
    どうがお知恵をお貸しください。よろしくお願いいたします。

    モデレーター jim912

    (@jim912)

    nsnyさん、こんにちは。

    ソースや文章の中からタグなどの一定のパターンを抽出するときは、正規表現を用いるとやりやすいです。

    <?php
    $max_w = 100;
    $max_h = 100;
    if ( $post->post_parent == 0 ) {
    	$child_posts = get_posts( 'numberposts=-1&order=ASC&orderby=post_title&post_type=page&post_parent=' . $post->ID );
    	if ( $child_posts ) {
    		foreach ( $child_posts as $child ) {
    			$c_postname = $child->post_name ;
    			if ( preg_match( '/<img[^>]+?>/i', $child->post_content, $image ) ) {
    
    			 	preg_match( '/width="([\d]+)"/i', $image[0], $img_width );
    			 	preg_match( '/height="([\d]+)"/i', $image[0], $img_height );
    
    				$image[0] = preg_replace( '/class="([^"]*)(alignleft|alignright|aligncenter)([^"]*)"/i', 'class="$1alignnone$3"', $image[0] );
    
    				if ( $img_width[1] > $max_w || $img_height[1] > $max_h ) {
    					if ( $img_width[1] <= $max_w ) {
    						$img_width = '';
    						$img_height = ' height="' . $max_h . '"';
    					} elseif ( $img_height[1] <= $max_h ) {
    						$img_width = ' width="' . $max_w . '"';
    						$img_height = '';
    					} else {
    						if ( $img_width[1] * $max_h > $img_height[1] * $max_w ) {
    							$img_width = ' width="' . $max_w . '"';
    							$img_height = '';
    						} else {
    							$img_width = '';
    							$img_height = ' height="' . $max_h . '"';
    						}
    					}
    					$image[0] = preg_replace( '/ width="[\d]+"/i', $img_width, $image[0] );
    					$image[0] = preg_replace( '/ height="[\d]+"/i', $img_height, $image[0] );
    				}
    ?>
    <div class="child_index">
    <?php echo apply_filters( 'the_title', $child->post_title ); ?>
    <?php echo $image[0]; ?>
    </div>
    <?php
    			}
    		}
    	}
    }
    ?>

    ※ 最初の1つのみでよいので、画像タグの抽出にはpreg_matchを使っています。全てを取得する場合は、preg_match_allが利用できます。
    ※ 画像のサイズ取得も、タグの記述を元にしています。厳密性を重視するのであれば、getimagesizeを用いるべきすが。
    ※ 画像の配置指定はalignnoneになるように置換処理を行っています。

    トピック投稿者 nsny

    (@nsny)

    jim912さん、素晴らしいコード本当にありがとうございます!
    親ページのギャラリーは思った通りの表現ができました。
    それでできればもうひとつ教えていただきたいのですが、出力した画像とタイトルにその各子ページのアンカーをつけたいのですがそれはどうすればよいのでしょうか?
    本当にわがままですが御教授いただければ幸いです。

    モデレーター jim912

    (@jim912)

    nsnyさん、こんにちは。

    <a href="<?php echo get_permalink( $child->ID ); ?">

    で子ページへのリンクになりますです。

    トピック投稿者 nsny

    (@nsny)

    jim912さん、さっそくのお答えありがとうございます。

    <a href="<?php echo get_permalink( $child->ID ); ?>">

    で子ページへのパーマリンクが取得できました。
    本当にありがとうございます。
    jim912さんのおかげでまたひとつサイト完成まで近づけました。
    こちらの件は解決いたしましたのでトピックはしめさせていただきますが、またわからないことがあったらお邪魔させていただこうと思いますので、その時はまたよろしくお願いいたします。
    本当にありがとうございました。

5件の返信を表示中 - 1 - 5件目 (全5件中)
  • トピック「親ページで属する子ページの最初の画像をギャラリー化する」には新たに返信することはできません。