Wsparcie » Zaawansowane » Pętla wyświetlająca odpowiednie posty

  • Witam, mam mały problem, chcę zrobić pętlę która będzie wyświetlać kolejno posty:
    1 post
    od 2 do 4
    5 post
    6 post
    7 post

    Chodzi mi o to, że dla każdego posta robię inny wygląd, mam pewien kod lecz on nie działa za dobrze – gdy dodam więcej postów coś się pętli. Pomoże ktoś? Za pomoc wykonam grafikę lub coś zapłącę jak zrobi ktoś dobrze..

    Mój kod:

    <div class=”col-sm-9 col-md-9″>
    <?php $loop = new WP_Query( array( 'posts_per_page’ => -1 ) ); ?>
    <?php while ( $loop->have_posts() ) : $loop->the_post(); $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); ?>

    <? if($x > 8 and $x < 11) { ?>

    <div class=”col-md-12″>
    <article id=”post-<?php the_ID(); ?>” <?php post_class(); ?> style=”float:left;” >

    <div class=”col-md-8″ style=”left:-15px;height:318px;”>
    <? if( has_post_thumbnail( $post_id ) ): ?>
    <div class=”post-image”>
    <img title=”<?php the_title(); ?>” alt=”<?php the_title(); ?>” class=”wp-post-image”
    src=”<?=wp_get_attachment_url( get_post_thumbnail_id() ); ?>” style=”width:100%; height:318px;box-shadow: #c5c5c5 1px 1px 10px;”>
    </div>
    <? endif; ?>
    </div>

    <div class=”col-md-4″ style=”height:282px;margin-top:26px;padding-left: 0px;padding-right: 0px;left: -35px;”>
    <div style=”border-bottom: 15px solid rgba(0, 0, 0, 0);
    border-right: 15px solid #FFFFFF;
    border-top: 15px solid rgba(0, 0, 0, 0);
    content: ”;
    display: block;
    height: 0;
    right: 105%;
    top: 25%;
    position: absolute;
    width: 0;”></div>

    <div style=”background:#fff;width:110%;padding:25px 25px 25px 25px;box-shadow: #c5c5c5 1px 1px 10px;margin-left:-14px;height:268px;”>
    <div style=”font-size:24px;font-weight:bold;padding-bottom:10px;font-family: 'Playfair Display’, Serif;text-transform:uppercase;”><?php
    $mytitle = get_the_title();
    if ( strlen($mytitle) >14 )
    $mytitle = substr($mytitle,0,14);
    echo $mytitle ;
    ?></div>

    <div style=”font-size:13px;font-weight:400;line-height:1.6;font-family: 'Merriweather’, serif;padding-bottom:10px;”><?php echo substr(get_the_excerpt(), 0,220); ?>..</div>
    <div style=”padding-bottom:0px;”>” style=”color:#27589b;font-size:13px;font-weight:400;line-height:1.6;font-family: 'Merriweather’, serif;”>Read More</div>
    </div></div>

    </article><!– #post-## –>
    </div>

    <? } $x++; ?>

    <? $x++; ?>
    <?php endwhile; wp_reset_query(); ?>

    <?php $loop = new WP_Query( array( 'posts_per_page’ => -1 ) ); ?>
    <?php while ( $loop->have_posts() ) : $loop->the_post(); $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); ?>

    <? if($x > 26 and $x < 30) { ?>

    <div class=”col-md-12″>
    <article id=”post-<?php the_ID(); ?>” <?php post_class(); ?> style=”float:left;” >

    <div class=”col-md-12″ style=”left:-15px;height:318px;”>
    <? if( has_post_thumbnail( $post_id ) ): ?>
    <div class=”post-image”>
    <img title=”<?php the_title(); ?>” alt=”<?php the_title(); ?>” class=”wp-post-image”
    src=”<?=wp_get_attachment_url( get_post_thumbnail_id() ); ?>” style=”width:100%; height:318px;box-shadow: #c5c5c5 1px 1px 10px;”>
    </div>
    <? endif; ?>
    </div>

    <div class=”col-md-12″ style=”background:#fff;height:auto;left: -15px;”>

    <div style=”padding:25px 25px 25px 25px;box-shadow: #c5c5c5 1px 1px 10px;”>
    <div style=”font-size:24px;font-weight:bold;padding-bottom:10px;font-family: 'Playfair Display’, Serif;text-transform:uppercase;”><?php
    $mytitle = get_the_title();
    if ( strlen($mytitle) >25 )
    $mytitle = substr($mytitle,0,25);
    echo $mytitle ;
    ?></div>

    <div style=”color:#27589b;font-size:14px;font-weight:400;line-height:1.6;font-family: 'Merriweather’, serif;padding-bottom:10px;”><?php the_date(’d.m.Y g:i A’); ?></div>

    <div style=”font-size:14px;font-weight:400;line-height:1.6;font-family: 'Merriweather’, serif;padding-bottom:10px;”><?php echo substr(get_the_excerpt(), 0,400); ?></div>
    <div style=”padding-bottom:0px;”>” style=”color:#27589b;font-size:14px;font-weight:400;line-height:1.6;font-family: 'Merriweather’, serif;”>Read More</div>

    </div></div>

    </article><!– #post-## –>
    </div>

    <? } $x++; ?>

    <? $x++; ?>
    <?php endwhile; wp_reset_query(); ?>

    <?php $loop = new WP_Query( array( 'posts_per_page’ => -1 ) ); ?>
    <?php while ( $loop->have_posts() ) : $loop->the_post(); $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); ?>

    <? if($x > 44 and $x < 47) { ?>

    <div class=”col-md-12″>
    <article id=”post-<?php the_ID(); ?>” <?php post_class(); ?> style=”float:left;” >

    <div class=”col-md-12″ style=”left:-15px;height:318px;”>
    <? if( has_post_thumbnail( $post_id ) ): ?>
    <div class=”post-image”>
    <img title=”<?php the_title(); ?>” alt=”<?php the_title(); ?>” class=”wp-post-image”
    src=”<?=wp_get_attachment_url( get_post_thumbnail_id() ); ?>” style=”width:100%; height:318px;box-shadow: #c5c5c5 1px 1px 10px;”>
    </div>
    <? endif; ?>
    </div>

    <div class=”col-md-12″ style=”background:#fff;height:auto;left: -15px;”>

    <div style=”padding:25px 25px 25px 25px;box-shadow: #c5c5c5 1px 1px 10px;”>
    <div style=”font-size:24px;font-weight:bold;padding-bottom:10px;font-family: 'Playfair Display’, Serif;text-transform:uppercase;”><?php
    $mytitle = get_the_title();
    if ( strlen($mytitle) >25 )
    $mytitle = substr($mytitle,0,25);
    echo $mytitle ;
    ?></div>

    <div style=”color:#27589b;font-size:14px;font-weight:400;line-height:1.6;font-family: 'Merriweather’, serif;padding-bottom:10px;”><?php the_date(’d.m.Y g:i A’); ?></div>

    <div style=”font-size:14px;font-weight:400;line-height:1.6;font-family: 'Merriweather’, serif;padding-bottom:10px;”><?php echo substr(get_the_excerpt(), 0,400); ?></div>
    <div style=”padding-bottom:0px;”>” style=”color:#27589b;font-size:14px;font-weight:400;line-height:1.6;font-family: 'Merriweather’, serif;”>Read More</div>

    </div></div>

    </article><!– #post-## –>
    </div>

    <? } $x++; ?>

    <? $x++; ?>
    <?php endwhile; wp_reset_query(); ?>
    </div>

  • Temat ‘Pętla wyświetlająca odpowiednie posty’ jest zamknięty na nowe odpowiedzi.