Question

我有这行代码，可以从某种帖子类型生成帖子：

    <div class="row">

        <?php
            $args = array(
                'post_type' => 'cases',
                'posts_per_page' => 3,
                offset => 2
            );
            $the_query1 = new WP_Query( $args );
            if ( $the_query1 -> have_posts() ):
            while ( $the_query1->have_posts() ): $the_query1->the_post();
        ?>

        <div class="col-sm-4">
            <div class="case-container">
                <div class="case-info-triple">
                    <h4 id="case-title"><?php the_title(); ?></h4>
                    <p id="case-type"><?php the_field('case_type') ?></p>
                    <p id="case-desc"><?php $caseteaser = get_field('case_content', false, false); echo substr($caseteaser, 0, 200); ?></p>
                    <img src="Diensten - zeo9-arrow.png" /><a href="<?php the_field('case_url') ?>">Bekijk deze case</a>
                </div>
            </div>
        </div>

        <?php endwhile; wp_reset_postdata();?>
        <?php endif;?>

    </div>

这将产生此结果：

但是，我希望每三个'case-info-triple'元素都有自己的唯一ID。例如<div class="case-info-triple-1">，<div class="case-info-triple-2">，<div class="case-info-triple-3">，然后是<div class="case-info-triple-1">，<div class="case-info-triple-2">等，等等。

请参见相应来源：

我们现在每页显示3个帖子，但是将来我们会将其更改为9个。基本上，每个第一，第二和第三信息元素都有其自己的颜色，我需要它们具有唯一的ID，以便可以使用CSS设置样式。

该如何处理？

Answer 1

在while循环之前，初始化一个变量：

$cnt = 0;

然后在while循环中，您可以输入以下内容：

$classID = $cnt++%3;

可将计数器递增，然后将模数递增3。您可以针对任意数量的列进行调整。使用3作为模数将产生一个介于0和2之间的数字。然后在此处使用classID：

<div class="case-info-triple<?php echo '-'.$classID; ?>">

或者您可以跳过$cnt变量，并在回显classID的同时进行增量操作，如下所示：

$classID = 0;

while($classID <= 5) { ?>
    <div class="case-info-triple<?php echo '-'.$classID++%3; ?>">text</div>
<?php }

Answer 2

有很多选择，但是您可以使用计数器变量，并将其添加到类名中以使其唯一，例如，在代码中，您可以这样：-

<div class="row">

<?php
    $args = array(
        'post_type' => 'cases',
        'posts_per_page' => 3,
        offset => 2
    );
    $the_query1 = new WP_Query( $args );
    if ( $the_query1 -> have_posts() ):
    $id = 1;
    while ( $the_query1->have_posts() ): $the_query1->the_post();
    $infoClassName = "case-info-triple-"+$id;
?>

<div class="col-sm-4">
    <div class="<?php echo $infoClassName; ?>">
        <div class="case-info-triple">
            <h4 id="case-title"><?php the_title(); ?></h4>
            <p id="case-type"><?php the_field('case_type') ?></p>
            <p id="case-desc"><?php $caseteaser = get_field('case_content', false, false); echo substr($caseteaser, 0, 200); ?></p>
            <img src="Diensten - zeo9-arrow.png" /><a href="<?php the_field('case_url') ?>">Bekijk deze case</a>
        </div>
    </div>
</div>

<?php $id++; ?>
<?php endwhile; wp_reset_postdata();?>
<?php endif;?>

Answer 3

您可以向数组添加表示行的参数（3行包含3个帖子）吗？

$args = array(
  'post_type' => 'cases',
  'posts_per_row' => 3,
  'rows_per_page' => 3,

然后在脚本中移动html，以便您可以根据帖子的哪一行插入if... elseif... else节来自动命名<div class="case-info-triple-1">，-2或-3它在里面。

为前三个元素赋予唯一的ID，然后对后三个重复

3 个答案: