我如何获得 PHP 生成的 HTML <ul> 列表以仅将规则应用于该列表中的第一个 <li> 项目?

How do i get a PHP generated HTML <ul> list to apply a rule to only the first <li> item in that list?

生成我的 Joomla 网站上阅读最多的文章列表并显示其介绍图片的代码如下:

<ul class="mostread<?php echo $moduleclass_sfx; ?>">



    <?php foreach ($list as $item) : ?>
      <?php $images = json_decode($item->images); ?>
        <?php if( $images->image_intro ) : ?>
            <img src="<?php echo $images->image_intro; ?>" alt="<?php echo htmlspecialchars($item->title); ?>" />
        <?php endif; ?>
    <li itemscope itemtype="https://schema.org/Article">
        <a href="<?php echo $item->link; ?>" itemprop="url">
            <span itemprop="name">
                <?php echo $item->title; ?>
            </span>
        </a>
    </li> 
    <?php endforeach; ?>


</ul>

我几乎没有使用 PHP 的经验,我需要对这段代码做些什么才能让它只显示第一个项目的图像而不是所有项目的图像?

这样试试..

显示第一项后设置变量 $first = true; 将其设置为 false

<ul class="mostread<?php echo $moduleclass_sfx; ?>">

    <?php 
    $first = true;//initially set true
    foreach ($list as $item) : ?>
      <?php $images = json_decode($item->images); ?>
        if($first==true){ ?> //checks $first is true if true prints
        <?php if( $images->image_intro ) : ?>
            <img src="<?php echo $images->image_intro; ?>" alt="<?php echo htmlspecialchars($item->title); ?>" />
        <?php endif;

    <li itemscope itemtype="https://schema.org/Article">
        <a href="<?php echo $item->link; ?>" itemprop="url">
            <span itemprop="name">
                <?php echo $item->title; ?>
            </span>
        </a>
    </li> 

    <?php 
    }
    $first = false;//after printing first item set it false
    endforeach; ?>


</ul>

@hek-mat 很接近,但 OP 试图阻止其他帖子上的 图像 显示, 而不是 link 和标题.

<?php
  // track if we've seen an image yet or not
  $seen_first = false;

  foreach ( $list as $item ) :
    $images = json_decode( $item->images );

    // OP only wants posts with image_intros
    if ( $images->image_intro ) :

      // OP only wants to see the first item's image
      if ( ! $seen_first ) :
        ?>
          <img src="<?php echo $images->image_intro; ?>" alt="<?php echo htmlspecialchars( $item->title ); ?>" />
        <?php

        // don't show another image
        $seen_first = true;

      // end "if first not seen yet"
      endif;

      // show the article (for all)
      ?>
        <li itemscope itemtype="https://schema.org/Article">
          <a href="<?php echo $item->link; ?>" itemprop="url">
            <span itemprop="name"><?php echo $item->title; ?></span>
          </a>
        </li> 
      <?php

    // end "if image_intro"
    endif;
  endforeach;
?>

要仅显示第一个项目图像,请按以下方式操作。

<?php 
$first = true;//initially set true
foreach ($list as $item) : 

        $images = json_decode($item->images); 

        if($first==true): 

            if( $images->image_intro ) : ?>

                <img src="<?php echo $images->image_intro; ?>" alt="<?php echo htmlspecialchars($item->title); ?>" />

        <?php

            endif;

        endif;

        $first = false;

        ?>

<li itemscope itemtype="https://schema.org/Article">
    <a href="<?php echo $item->link; ?>" itemprop="url">
        <span itemprop="name">
            <?php echo $item->title; ?>
        </span>
    </a>
</li> 


<?php endforeach; ?>

与修改 PHP 相比,将一些 CSS 添加到自定义 CSS 文件可能更容易,如下所示:

ul.mostread img {display: none;}
ul.mostread img:first-of-type {display: block;}

这样只显示第一张图片。

有关如何在 Joomla 中创建自定义 CSS 文件的说明,请参阅 https://joomla.stackexchange.com/a/3878/120

自定义 CSS 文件还有一个优点,即它不会被任何未来的 Joomla 或模板更新覆盖。