Modifica questo loop per adattarlo al mio slider jQuery (slides)

Question

Modifica questo loop per adattarlo al mio slider jQuery (slides)

7 mar 2012, 10:30:12

Visualizzazioni: 2.15K

Voti: 2

Sto cercando di creare uno slider che mostri le thumbnail da un custom post type specifico, visualizzandone 4 per ogni "slide". Lo slider e le thumbnail funzionano correttamente, ma non sono sicuro di come modificare il loop per fargli visualizzare 4 post in un contenitore, poi ripetere con i successivi 4 post e così via.

Il mio loop è questo:

<div id="slides">
    <div class="slides_container">

        <?php $loop = new WP_Query(array('post_type' => 'fastighet', 'posts_per_page' => -1, 'orderby'=> 'ASC')); ?>
        <?php while ( $loop->have_posts() ) : $loop->the_post(); ?>

            <div class="slide">
                <?php $url = get_post_meta($post->ID, "url", true);
                if($url!='') {
                    echo '<a href="'.$url.'">';
                    echo the_post_thumbnail('admin-list-thumb');
                    echo '</a>';
                } else {
                    echo the_post_thumbnail('admin-list-thumb');
                } ?>
                <div class="caption">
                    <h5><?php the_title(); ?></h5>
                </div>
            </div>

        <?php endwhile; ?>
        <?php wp_reset_query(); ?>

    </div> <!-- fine .slides_container -->

    <a href="#" class="prev">prec</a>
    <a href="#" class="next">succ</a>

</div> <!-- fine .slides -->

Ogni div con la classe slide diventa una slide come puoi vedere. Ma come posso fare per inserire 4 post in ogni slide, poi altri 4 post in un'altra slide e così via?

Qualsiasi aiuto o suggerimento sarebbe davvero apprezzato!

Johan Dahl

1.34K

jquery loop slideshow

Commenti

Dato che sai già come interrogare i tuoi post e come restituire l'immagine in evidenza da quei post, ciò che rimane è davvero una domanda di PHP, piuttosto che una domanda di WordPress.

Chip Bennett

7 mar 2012 14:38:52

Tutte le risposte alla domanda

Commenti

Sembra che ottenga ancora solo un'immagine per slide per qualche motivo. Inoltre le miniature non linkano a nulla, anche se dovrebbero linkare a ciascun post.

Johan Dahl

7 mar 2012 11:07:51

@JohanDahl: c'era un errore nel mio codice. L'ho sistemato. Prova ora.

Sisir

7 mar 2012 11:15:28

Sì ho notato il <?php mancante, e l'ho aggiunto. Però non è cambiato nulla. Ottengo ancora solo uno slide per immagine :/

Johan Dahl

7 mar 2012 11:20:18

@JohanDahl Tipo cosa adesso?

kaiser

7 mar 2012 11:22:39

Ho aggiornato il mio codice per far funzionare altre cose. Ottengo ancora solo una miniatura di post per slide però.

http://pastebin.com/WbERsyUH

Johan Dahl

7 mar 2012 11:33:01

Mostra i restanti 12 commenti

Quasi corretto. L'unico problema era che in realtà non vuoi stampare sia l'apertura che la chiusura sullo stesso indice. Il seguente codice funziona per me in una situazione simile. L'unica vera modifica è che $i inizia da 1 e stampa i tag di apertura e chiusura degli slide su conteggi diversi.

Ho anche preso la libertà di pulire un po' il codice.

<div id="slides">
    <div class="slides_container">

        <?php 
        $loop = new WP_Query( array( 
            'post_type' => 'fastighet', 
            'posts_per_page' => -1 
        ) ); 
        $i = 1; 
        while ( $loop->have_posts() ) : 
            $loop->the_post(); 
            if( $i % 4 == 1 ) : 
                ?>
                <div class="slide">
                <?php 
            endif; 
            ?>
            <div class="fastighet-slider-entry">
                <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php the_post_thumbnail(); ?></a>
                <div class="caption">
                    <h5><?php the_title(); ?></h5>
                </div>
            </div> <!-- fine .fastighet-slider-entry -->
            <?php 
            if( $i % 4 == 0 ) : 
                ?>
                </div>
                <?php 
            endif; 
            ++$i; 
        endwhile; 
        wp_reset_query(); 
        ?>

    </div> <!-- fine .slides_container -->

    <a href="#" class="prev">precedente</a>
    <a href="#" class="next">successivo</a>

</div> <!-- fine .slides -->

Kokarn

1

7 mar 2012 16:07:09

Sisir 7.82K · Accepted Answer · 2012-03-07T10:45:39Z

Provato una matematica molto semplice. <div class="slide"> verrà stampato dopo ogni 4 post. Quindi, un'istruzione if con la logica old school $i%4 == 0

<div class="slides_container">

                        <?php 
                            $args = array(
                                                        'post_type' => 'fastighet',
                                                        'numberposts' => -1,
                                                        'orderby' => 'ASC'
                                                    );
                            $posts = get_posts($args);
                            ?>
                        <?php $i = 0; foreach($posts as $post): ?>
                            <?php if($i%4 == 0): ?>
                                <div class="slide">
                            <?php endif; 
                                        $url = get_post_meta($post->ID, "url", true);
                                        if($url) {
                                                echo '<a href="'.$url.'">';
                                                echo the_post_thumbnail('admin-list-thumb');
                                                echo '</a>';
                                        } else {
                                                echo the_post_thumbnail('admin-list-thumb');
                                        } ?>
                                        <div class="caption">
                                                <h5><?php the_title(); ?></h5>
                                        </div>
                              <?php if($i%4 == 3): ?></div> <!--fine .slide--><?php endif; ?> 

                        <?php $i++; endforeach; ?>

                </div> <!-- fine .slides_container -->

Fammi sapere come va. Grazie!