サポート » 使い方全般 » アイキャッチを使わずにサムネイルを正方形に

  • 解決済 kurousa007

    (@kurousa007)


    いつもお世話になっております。

    ワードプレスもアイキャッチ画像が設定できるようになってから、プラグイン等でサムネイルを育成しなくても表示されるようになりましたが、次の様なコードで自動で投稿中の1枚目の画像を抽出したとき、どうしてもサムネイルが正方形に切り抜けません。

    CSSで設定すれば、正方形になるのですが、縦横比率を無視した圧縮なのです。
    色々調べてみたのですが、どうしても分からなくてまたここに書き込みしています。

    どなたかお力を貸してください。

    function.php

    //記事中の画像の1枚目を抽出する
    function getPostImage($mypost){
    if(empty($mypost)){ return(null); }
    if(ereg('<img([ ]+)([^>]*)src\=["|\']([^"|^\']+)["|\']([^>]*)>',$mypost->post_content,$img_array)){
    
    if ($w_ratio < $h_ratio) {
    $width = $o_width * $h_ratio;
    }else{
    $height = $o_height * $w_ratio;
    }
    
    // imgタグで直接画像にアクセス
    $dummy=ereg('<img([ ]+)([^>]*)alt\=["|\']([^"|^\']+)["|\']([^>]*)>',$mypost->post_content,$alt_array);
    $resultArray["url"] = $img_array[3];
    $resultArray["alt"] = $alt_array[3];
    }else{
    
    // 直接imgタグにてアクセス紐づけられた画像取得
    $files = get_children(array('post_parent' => $mypost->ID, 'post_type' => 'attachment', 'post_mime_type' => 'image'));
    if(is_array($files) && count($files) != 0){
    $files=array_reverse($files);
    $file=array_shift($files);
    $resultArray["url"] = wp_get_attachment_url($file->ID);
    $resultArray["alt"] = $file->post_title;
    }else{
    return(null);
    }
    }
    return($resultArray);
    }

    archive.php

    <?php  $postImage = getPostImage($post);
    	if($postImage == null){
    	// 画像が無い場合の処理:No Image画像をセットするなどを記述
    	}else{
    	// 画像がある場合の処理
    	echo '<img class="date" alt="'.$postImage["alt"].'" src="'.$postImage["url"].'" />';} ?>

    CSS

    img.date{
    	float:left;
    	margin-right:5px;
    	clip:rect(0px 128px 128px 0px);
    	width:90px;
    	height:90px;
    }

    また、アイキャッチを素直に利用する方法が一番簡単なのですが、アイキャッチは手動で設定のため、今までに投稿した4000本の記事を手動で設定できません。
    画像は、アップロードフォルダではなく、ワードプレスの外にimgフォルダを作っています。

3件の返信を表示中 - 1 - 3件目 (全3件中)
  • imgタグではなく、divタグ等で背景画像としてcssでポジションを画像の中央付近に設定して表示するという方法はどうでしょう?

    参考サイト:http://d.hatena.ne.jp/calpo/20110408/p1

    デザインとの兼ね合いになると思いますが、元の画像にある程度の大きさがあればどんな画像でも参考サイトのように正方形に見せかけて表示する事が出来ると思います。

    上記のサイトを参考に、archive.phpの「画像がある場合の処理」の部分に
    divとstyleを生成するようにして、getPostImageから受け取る$postImage[“url”]を
    styleのbackgroundに設定してやれば上手く行くと思います。

    すべての画像添付ファイルはサムネイルを持っていますので、
    function.php で
    wp_get_attachment_url($file->ID);
    としている箇所を、
    echo wp_get_attachment_image( $attachment->ID, 'thumbnail' );

    とすると、この添付ファイルのサムネイルを表示するこができます。

    サムネイルのサイズはメディアの設定によります。
    ダッシュボードの[設定]で[メディア]-[サムネイルのサイズ]というのがあるので、
    ここを正方形にしておけばよいですよ。(たぶんデフォルト正方形かな?)

    トピック投稿者 kurousa007

    (@kurousa007)

    t.okuboさん>
    ありがとうございます。今、そのページを見てみましたが、

    >getPostImageから受け取る$postImage[“url”]を
    styleのbackgroundに設定

    が直ぐに書けそうもないので、調べてみます。
    CSSに書くバックグラウンドのURL取得を自動化しないと成り立たないですもんね。

    sysbirdさん>
    回答ありがとうございます!
    画像添付でアップロードしてないんです・・・。
    別のimgフォルダにアップロードしたモノに直リンクさせています。
    試しにコードを差し替えてみましたが、サーバーエラーが起きてしまいました;;

3件の返信を表示中 - 1 - 3件目 (全3件中)
  • トピック「アイキャッチを使わずにサムネイルを正方形に」には新たに返信することはできません。