How to make a repeater in wordpress with a row of two columns and another of three

1

Hello I'm wanting to make a repeater in wordpress but I had a problem with the diagram done in bootstrap. I attached an image of said example The code that I implement is the following: Although I assemble a repeater what makes me repeat the columns in col-lg-6

How could I solve it? doing some kind of counter?

			<section class="container services">
				<div class="row text-center animated fadeInUp notransition">
	                <?php if(have_rows('proceso_de_consultoria')):
	                    while(have_rows('proceso_de_consultoria')): the_row();?>		
							<div class="col-md-6">
								<i class="<?php the_sub_field('icono_consultoria'); ?> "></i>
								<?php the_sub_field('descripcion_de_los_pasos'); ?>
							</div>
	                	<?php endwhile;
	                endif;?>
	                <!-- <div class="col-md-6">
						<i class=" icon-eye-open"></i>
						<h4>EVALUACIÓN</h4>
						<p>Evaluación, diagnóstico y certificación de programadores.</p>
					</div> -->
				</div>

					<!-- 	<div class="row text-center topspace30 animated fadeInDown notransition">
			
					<div class="col-md-4">
						<i class="icon-file-text"></i>
						<h4>MARCOS (Radan)</h4>
						<p>Escritura de macros de personalización de su sistema (sólo Radan).</p>
					</div>
					
					<div class="col-md-4">
						<i class="icon-thumbs-up-alt"></i>
						<h4>INTEGRACIÓN</h4>
						<p>Integración MRP / ERP</p>
					</div>
					
					<div class="col-md-4">
						<i class="icon-gear"></i>
						<h4>POST PROCESADORES<br />(Radan / Edgecam)</h4>
						<p>Escritura de Post Procesadores a medida</p>
					</div>
				</div> -->

			</section>
		<?php endif; ?>
    
asked by MarianoF 15.03.2018 в 20:20
source

1 answer

1

Ok, I understand that you want to build this structure HTML iterating in the post consulted.

I also understand that according to what you mention, you will always show 5 results distributed as follows:

  • In the first row, the first two columns will be shown in two columns results
  • In the second row the remaining three
  • It could be solved with a counter that controls the post number in which the loop is located and assigning the class based on it.

    In this particular case, the first row will always have two columns and all of the following will have three.

    Here is the code with the commented changes:

        <section class="container services">
          <div class="row text-center animated fadeInUp notransition">
            <?php if (have_rows('proceso_de_consultoria')):
    
                //Variable contador que contará el número de post mostrado
                $i=0;
    
                while (have_rows('proceso_de_consultoria')): the_row(); 
    
                //aquí definimos la clase en función del post en el que nos encontramos
                $i<2 ? $class="col-md-6" : $class="col-md-4";
    
                      //imprimimos la clase ?>
                    <div class="<?php echo $class ?>>
    
                        <i class="<?php the_sub_field('icono_consultoria'); ?> "></i>
                        <?php the_sub_field('descripcion_de_los_pasos'); ?>
                    </div>
                <?php 
    
                // incrementamos el valor del contador
                 $i++;
    
                endwhile;
            endif; ?>
            <div class="col-md-6">
                <i class=" icon-eye-open"></i>
                <h4>EVALUACIÓN</h4>
                <p>Evaluación, diagnóstico y certificación de programadores.</p>
            </div>
        </div>
    </section>
    
        
    answered by 16.03.2018 / 09:58
    source