2014-04-10 5 views
0

iam 카테고리 "66"에서 10 개의 게시물을 받고 있지만 큰 미리보기 이미지가있는 첫 번째 게시물과 작은 미리보기 이미지와 나머지 게시물을 큰 미리보기 이미지와 함께 중간에 표시 할 수 있습니다. . 나는 CSS에서 코드를 가지고 있지만 같은 카테고리에서 10 개의 게시물을 호출하는 방법을 지정하는 방법을 모른다. 내가 가장 오래된 순서로 최신 게시물 순서를 원하기 때문에 mysql에서 2 통화를하고 싶지 않다 ...이미지 크기 사용자 정의 css 게시물

고맙습니다.

 <?php 
     global $post; 
     $args = array('numberposts' => 10, 'order' => 'ASC', 'category' => 66); 
     $myposts = get_posts($args); 
     foreach($myposts as $post) : setup_postdata($post); ?> 
      <div id="lajme-bllok-item-vogel"> 
       <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('lajmi-thumb'); ?></a> 
       <div id="lajme-bllok-item-title-vogel"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></div> 
       <div id="top-news-title-linku"><?php for($i=1; $i<=4; $i++){ $prop_det_url = get_field('link'.$i); if($prop_det_url != ''){ ?> 
       <a href="<?php echo $prop_det_url; ?>" target="_blank">/ <?php the_field('link_titull'.$i); ?></a> <?php } } ?></div> 
      </div> 

     <?php endforeach; ?> 
+0

당신은 다른 클래스/이미지 크기를 정의 할 수 있으며 루프에서 카운터를 실행하고 카운터 호출에 따라 해당 클래스/이미지 크기에 따라 달라질 수 있습니다. – Ron

답변

1

하나 개의 솔루션 : 클래스 이름으로 HTML 마크 업으로 범주를 넣어 예를 들어, <div class="category66"> 그런 다음 nth-child을 사용하여 각 클래스에 대한 CSS 선택기를 생성 하시겠습니까?

.category66 { 
    width: 100px; 
    height: 100px; 
} 


.category66:nth-child(1) { 
    width: 200px; 
    height: 200px; 
} 
0

당신은 코드 주위에 if statement를 추가하고 큰 이미지, 다른 작은 하나를 설정을 설정 첫 번째 결과인지 말할 수 있습니다. 테스트되지 않았지만 작동해야합니다.

<?php 
    global $post; 
    $args = array('numberposts' => 10, 'order' => 'ASC', 'category' => 66); 
    $myposts = get_posts($args); 
    $count = 1; 
    foreach($myposts as $post) : setup_postdata($post); 
    if($count=1) 
    { 
    ?> 

     <div id="lajme-bllok-item-vogel"> 
      <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('lajmi-thumb'); ?></a> //Set the big thumbnail there 
      <div id="lajme-bllok-item-title-vogel"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></div> 
      <div id="top-news-title-linku"><?php for($i=1; $i<=4; $i++){ $prop_det_url = get_field('link'.$i); if($prop_det_url != ''){ ?> 
      <a href="<?php echo $prop_det_url; ?>" target="_blank">/ <?php the_field('link_titull'.$i); ?></a> <?php } } ?></div> 
     </div> 
    <?php 
     $count = 2; 
    } 
    else 
    { 
    ?> 

     <div id="lajme-bllok-item-vogel"> 
      <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('lajmi-thumb'); ?></a> //Set the small thumbnail there 
      <div id="lajme-bllok-item-title-vogel"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></div> 
      <div id="top-news-title-linku"><?php for($i=1; $i<=4; $i++){ $prop_det_url = get_field('link'.$i); if($prop_det_url != ''){ ?> 
      <a href="<?php echo $prop_det_url; ?>" target="_blank">/ <?php the_field('link_titull'.$i); ?></a> <?php } } ?></div> 
     </div> 
    <?php 
    } 
    endforeach; ?>