每三张图片后添加一个新行 PHP

Question

我在 WordPress 中使用高级自定义字段创建了一个图片库。现在我需要添加一个 if 语句，它将回显一个新的 div 并在每三个图像之后用行的 class 关闭它。我试图自己做，但没有用。我哪里错了？

<div class="container">
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
        <?php the_content(); ?>
        <?php endwhile; else: ?>
        <p>No Content</p>
    <?php endif; ?>

    <?php 
        $images = get_field('gallery_images');
        $counter = 3;
    ?>

    <ul class="gal_list">
        <?php foreach( $images as $image ): ?>

        <?php 
            if($counter == 3){
                echo "<div class="row">";
                $counter = 0;
            }
        ?>

            <li class="col-md-4">
                <a class="img-responsive" href="<?php echo $image['url']; ?>" rel="<?php the_title() ?>"><img src="<?php echo $image['sizes']['thumbnail']; ?>" alt="<?php echo $image['alt']; ?>" /></a>
            </li>

            <?php 
                if($counter == 0){
                    echo "</div>";
                }
                $counter++;
            ?>
        <?php endforeach; ?>
    </ul>
</div>

Answer 1

您需要对引号进行转义，因为您正在使用 "

变化：

echo "<div class="row">";

收件人：

echo "<div class=\"row\">";

Answer 2

<div class="container">
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
        <?php the_content(); ?>
        <?php endwhile; else: ?>
        <p>No Content</p>
    <?php endif; ?>

    <?php 
        $images = get_field('gallery_images');
        $counter = 3;
    ?>

    <?php foreach( $images as $image ): ?>

    <!--add a new row after every three images-->
    <?php 
        if($counter == 3){
            echo "<ul class=\"row gal_list\">";
        }
    ?>

    <li class="col-md-4">
        <a class="img-responsive" href="<?php echo $image['url']; ?>" rel="<?php the_title() ?>"><img src="<?php echo $image['sizes']['thumbnail']; ?>" alt="<?php echo $image['alt']; ?>" /></a>
    </li>

    <!--close the row after three images, also decrement the counter and reset-->
    <?php 
        $counter--;
        if($counter == 0){
            echo "</ul>";
            $counter = 3;
        }
    ?>
    <?php endforeach; ?>
</div>

我这个代码可以吗？

每三张图片后添加一个新行 PHP

Adding a new row after every three images PHP

html

css

php

wordpress

advanced-custom-fields