Чередуйте строку и столбец каждые x постов по модулю

Я пытаюсь реализовать альтернативную строку и столбец для каждого сообщения x с использованием модуля. В следующем примере показана структура. Отображаются все сообщения, но не в соответствии со структурой 2-х и 3-х постов. Похоже, счетчик не работает и проблема с модулем. Спасибо за просмотр.

Например:

 // start for each     
 // 2 posts
        <div class = "row">
         <div class= "col-md-6"></div>
         <div class= "col-md-6"></div>
        </div>

    // next 3 posts in different row 
    <div class = "row">
      <div class= "col-md-4"></div>
      <div class= "col-md-4"></div>
      <div class= "col-md-4"></div>
    </div>

    // repeat this structure for all my posts so: 
    // 2 posts in a row 
    // 3 posts in a row
    // 2 posts in a row 
    // 3 posts in a row 
    // ... 
    // ...

-- end foreach --

Вот мой код.

  <div class = "wrapper container"> 
      <?php
       $count = 0;

     foreach(code) {
      if (!empty($listing_image_url)){     

        if ( $count % 5 === 0) : ?>
          <div class = "row"> 
             <div class = "col-md-6 list-column-block">
                  <ul>
              <li>
                <a href = "<?php echo url($Url); ?>" class = "listing__block__image">    
                  <div class = "inner">
                    <?php if (!empty($listing_image_url)){ ?>                              
                      <img src = "<?php echo $listing_image_url; ?>"/> 
                        <?php } ?>  
                          <div class = "caption">
                            <div class = "caption-inner">
                              <span class = "caption-appeared">
                                <h5><span><?php print $Count; ?> homes</span></h5>
                              </span>
                              <span class = "caption-des">
                                <?php print $title; ?></span><!--
                                 --><?php if ( $region ): ?><!--
                                 -->,<span class = "caption-location">
                                      <?php print $region; ?>
                                      </span>
                                <?php endif; ?>
                            </div>
                          </div>
                       </div>
                    </a>              
                 </li>
               </ul>
              </div>
            </div>
            <?php endif;
            $count++; 
        if ($count % 5 === 1) :
          endif; 

        if ( $count % 5 === 2) : ?>
          <div class = "row"> 
              <div class = "col-md-4 list-column-block">
                    <ul>
              <li>
                <a href = "<?php echo url($Url); ?>" class = "listing__block__image">    
                  <div class = "inner">
                    <?php if (!empty($listing_image_url)){ ?>                              
                      <img src = "<?php echo $listing_image_url; ?>"/> 
                        <?php } ?>  
                          <div class = "caption">
                            <div class = "caption-inner">
                              <span class = "caption-appeared">
                                <h5><span><?php print $Count; ?> homes</span></h5>
                              </span>
                              <span class = "caption-des">
                                <?php print $title; ?></span><!--
                                 --><?php if ( $region ): ?><!--
                                 -->,<span class = "caption-location">
                                      <?php print $region; ?>
                                      </span>
                                <?php endif; ?>
                            </div>
                          </div>
                       </div>
                    </a>              
                 </li>
               </ul>
             </div>
            </div>
          <?php endif;

            if ($count % 5 === 2 || $count % 5 === 3 || $count % 5 === 4) :
             endif; ?> 


       <?php } } ?>

php bootstrap-4 row multiple-columns modulo

01.05.2018 16:19

Стоит ли изучать PHP в 2023-2024 годах?

Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...

Symfony Station Communiqué - 7 июля 2023 г

Это коммюнике первоначально появилось на Symfony Station .

Оживление вашего приложения Laravel: Понимание режима обслуживания

Здравствуйте, разработчики! В сегодняшней статье мы рассмотрим важный аспект управления приложениями, который часто упускается из виду в суете...

Установка и настройка Nginx и PHP на Ubuntu-сервере

В этот раз я сделаю руководство по установке и настройке nginx и php на Ubuntu OS.

Коллекции в Laravel более простым способом

Привет, читатели, сегодня мы узнаем о коллекциях. В Laravel коллекции - это способ манипулировать массивами и играть с массивами данных. Благодаря...

Как установить PHP на Mac

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

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Насколько я понимаю, ваш код будет создавать новую строку (с одним столбцом) на каждой итерации.

Чтобы создать желаемую структуру, вы можете использовать временный счетчик. Я дам вам быстрый рабочий пример (сокращенный до самого важного). Как видите, я использую оператор по модулю только для определения четной или нечетной строки.

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

    $posts      = array(1, 2, 3, 4, 5, 6, 7, 8, 9, 10);
    $count_rows = 1;
    $tmp_counter    = 1;
    $html           = "";

    foreach ($posts as $post) 
    {
        if ($tmp_counter == 1){
            $html .= '<div class = "row">';   // create a new row on first run and after counter resets 
        }

        if ( $count_rows % 2 === 1) 
        {   
            // even row >> 2 Cols
            $html .= '<div class= "col-md-6">'.$post.'</div>';  // I would recommend to use a function to generate the post markup

            if ($tmp_counter == 2)
            {
                $html .= '</div>';  // close the row 
                $tmp_counter = 0;   // reset the temporary counter 
                $count_rows ++; // increase number of rows
            }
        }
        else
        {   
            // odd row >> 3 Cols
            $html .= '<div class= "col-md-4">'.$post.'</div>';  // I would recommend to use a function to generate the post markup

            if ($tmp_counter == 3)
            {
                $html .= '</div>';  // close the row 
                $tmp_counter = 0;   // reset the temporary counter 
                $count_rows ++; // increase number of rows
            }
        }

        $tmp_counter++;
    }
    if ($tmp_counter != 1){
        $html .= '</div>';  // close the last row
    }
    echo $html;

Большой! Логика работает, и я этого хотел. Большое спасибо.

— 01.05.2018 23:03

col-md-4 и col-md-6 имеют разную высоту. Что мне делать, чтобы установить одинаковую высоту строки для другого столбца?

— 02.05.2018 16:24

Высота зависит от вашего содержания. Почему бы не использовать правила CSS для ограничения высоты. Вы можете задать своему контенту фиксированную высоту и, например, ограничить текст определенным количеством строк или сделать текст прокручиваемым. Это зависит от ваших потребностей.

— 02.05.2018 20:05

01.05.2018 17:50