Question

我无法从3列的wordpress页面获取图像。

此刻，我的功能计算并将每3张图像放在一列中，但每排3张图像应排成一排。有人有想法达到这个目标吗？

例如，如果我有8张图像，我现在可以得到类似图片的内容。

http://i57.tinypic.com/mr4rbq.jpg

这是我的实际代码......

<?php
/*
Template Name: Team
*/


/**
 * Header einbinden
 */
get_header(); ?>


    <!-- Seiteninhalt dynamisch -->
    <div id="primary" class="content-area wrapper">
        <div id="content" class="site-content content" role="main">

        <div class="post row">


        <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

            <div class="col-md-12 dg_para dg_list">
                <h1 class="title"><?php the_title(); ?></h1>

            <?php
            $args = array(
                'post_type' => 'attachment',
                'numberposts' => -1,
                'post_status' => null,
                'post_parent' => $post->ID
            );

            $i = 0;
            $attachments = get_posts( $args );
                if ( $attachments ) {
                    foreach ( $attachments as $attachment ) {
                        if($i %3 == 0){
                        echo '</div><div class="col-md-4 dg_para">';
                        echo '<figure>';
                            echo wp_get_attachment_image( $attachment->ID, array(350,160), false, array( 'class' => 'dg_teamimg' ) );
                            echo '<figcaption><span class="dg_teamimgtext">';
                            echo apply_filters( 'the_title', $attachment->post_title );
                            echo '</span></figcaption></figure>';
                    }
                    else {
                        echo '<figure>';
                            echo wp_get_attachment_image( $attachment->ID, array(350,160), false, array( 'class' => 'dg_teamimg' ) );
                            echo '<figcaption><span class="dg_teamimgtext">';
                            echo apply_filters( 'the_title', $attachment->post_title );
                            echo '</span></figcaption></figure>';
                    }
                    $i++;
                    }
                }

            endwhile; endif; ?>
            </div>
        </div>
        </div>

        </div><!-- #content -->
    </div><!-- #primary -->
    <!-- Seiteninhalt dynamisch Ende -->
</div><!-- #container -->





<?php
 /**
  * Footer einbinden
  */
  get_footer();
?>

Answer 1

尝试以下for循环：

foreach ( $attachments as $attachment ) {
    if($i %3 == 0){
        echo '<div class="row">';
    }

    echo '<div class="col-md-4 dg_para">';
    echo '<figure>';
    echo wp_get_attachment_image( $attachment->ID, array(350,160), false, array( 'class' => 'dg_teamimg' ) );
    echo '<figcaption><span class="dg_teamimgtext">';
    echo apply_filters( 'the_title', $attachment->post_title );
    echo '</span></figcaption></figure>';
    echo '</div>';

    $i++;
    if($i %3 == 0 || count($attachments) == $i){
        echo '</div>';
    }
}

如果这是三个md-4列中的第一列，则会回显一行。之后，md-4 div与数字相呼应。在$i增加1之后，检查下一个循环是否会打开一行，或者这是否是最后一个循环。如果是这样，则行div被关闭。

WordPress如何在三列（模数）中排列图像？

1 个答案: