Bootstrap карт в кодеигниторе

Question

Я работаю над своим вторым проектом, однако из-за этого я застрял и буквально не нашел ничего в Интернете, поэтому мне пришло время спросить толпу из Stackoverflow. Я использую Codeigniter для работы на сайте обзора игр. Мне удалось загрузить данные фиктивных отзывов из базы данных на сайт. Однако я хотел бы использовать карты Bootstrap для хранения данных обзоров игр, таких как изображение, название игры и краткое описание обзора. Это мой код ниже:

<div class="container">
    <div class="row">
        <?php
        foreach ($result as $row)
        {


             $thisImage = $row->ReviewImage;
             echo "<tr>";
             echo "<td>". "<img src='application/images/$thisImage'".$row->ReviewImage."</td>";
             echo "<td>".$row->GameName."<br>"."<td>";
             echo "<td>".$row->GameBlurb."<br>"."<td>";
             echo "<td>".$row->GameReview."<br>"."<td>";
             
            // Look into the image properties library in CodeIgniter for more help on images:

        }
        ?>
    </div>
</div>
</body>

Если кто-то, кто раньше работал с Bootstrap картами, знает, как внедрить его в средство зажигания кода, я мог бы действительно помочь с этим, поскольку я попробовал все методы, но пока не удалось в этом.

Answer 1

Вот шаблон карты по умолчанию Bootstrap, Источник :

<div class="card" style="width: 18rem;">
  <img src="..." class="card-img-top" alt="...">
  <div class="card-body">
    <h5 class="card-title">Card title</h5>
    <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
    <a href="#" class="btn btn-primary">Go somewhere</a>
  </div>
</div>

Попробуйте:

...

<div class="row">
        <?php foreach ($result as $row):?>
             <div class="card" style="width: 18rem;">
                 <img src="application/images/<?= $row->ReviewImage ?>" class="card-img-top" alt="<?= $row->GameName ?>">
                 <div class="card-body">
                      <h5 class="card-title"><?= $row->GameName ?></h5>
                      <p class="card-text"><?= $row->GameBlurb . ' ' . $row->GameReview ?></p>
                      <a href="#" class="btn btn-primary">Go somewhere</a>
                 </div>
             </div>
        <?php endforeach; ?>
    </div>
...

Надеюсь, это поможет.

Answer 2

У вашего кода есть некоторые проблемы:

1. вам не нужны <tr> и <td>, так как вы не распечатываете HTML таблицу
2. в вашем изображении sr c атрибут, который вы используете $row->ReviewImage, дважды вы можете просто пропустить $thisImage = $row->ReviewImage;
3. при использовании PHP в HTML шаблоне использовать Альтернативный синтаксис для структур управления для большей читаемости, для реализации карты в вашем приложении просто следуйте документации для bootstrap карта , вот рекомендуемый код:

<div class="container">
  <div class="row">
    <?php foreach ($result as $row): ?>
      <div class="card" style="width: 18rem;">
        <img src="<?php echo '/games-rev/images/' . $thisImage; ?>" class="card-img-top" alt="title goes here" />
        <div class="card-body">
          <h5 class="card-title"><?php echo $row->GameName; ?></h5>
          <p class="card-text">
            <?php echo $row->GameBlurb; ?>
            <?php echo $row->GameReview; ?>
          </p>
          <a href="#" class="btn btn-primary">Go somewhere</a>
        </div>
      </div>
    <?php endforeach; ?>
  </div>
</div>