I need to close a div after the 3rd div and open a new div inside a repeatable region

The non code is below

Code: Select all

<div class="col-md-6">
                           <div class="about-us-post">
                              <div class="skew-box">
                                 <a href="#"><i class="fa fa-building-o"></i></a>
                              </div>
                              <h4>Health &amp; Safety Consultancy</h4>
                              <span>A competent consultant can provide innovative solutions in respect of the construction health and safety challenges that all organisations experience.</span>
                           </div>
                           <div class="about-us-post">
                              <div class="skew-box">
                                 <a href="#"><i class="fa fa-cogs"></i></a>
                              </div>
                              <h4>Inspections</h4>
                              <span>Our health and safety inspections comprise of a 1-2 hour visit by a NEBOSH qualified health and safety adviser.</span>
                           </div>
                           <div class="about-us-post">
                              <div class="skew-box">
                                 <a href="#"><i class="fa fa-desktop"></i></a>
                              </div>
                              <h4>Policies</h4>
                              <span>If you employ 5 or more workers then all construction businesses must have a written Health and Safety Policy.</span> 
                           </div>
                        </div>
                        <div class="col-md-6">
                           <div class="about-us-post">
                              <div class="skew-box">
                                 <a href="#"><i class="fa fa-desktop"></i></a>
                              </div>
                              <h4>PAT Testing</h4>
                              <span>PAT Testing is a simple procedure where all portable appliances contained within the premises are routinely checked to ensure they are safe.</span>
                           </div>
                           <div class="about-us-post">
                              <div class="skew-box">
                                 <a href="#"><i class="fa fa-tachometer"></i></a>
                              </div>
                              <h4>Fire Risk Assessment</h4>
                              <span>We are experienced in fire risk assessments and know how to complete this to the health and safety standards.</span>
                           </div>
                        </div>

The couchcms tags integrated into the coding is below

Code: Select all

<div class="col-md-6">
                            <cms:show_repeatable 'about_boxes'>
                           <div class="about-us-post">
                              <div class="skew-box">
                                 <a href="#"><i class="fa fa-building-o"></i></a>
                              </div>
                              <h4><cms:show small_heading/></h4>
                              <span><cms:show small_text/></span>
                           </div>
                               </cms:show_repeatable>
                        </div>

I need the div closed after the closing div for <div class="col-md-6"> and then reopen that div again

I have attached a screenshot of the layout it needs to look like

I can't seem to work out where to put the zebra tags to close the div and open it again

UPDATE: I have had another go and bit closer as the coding with the extra tags is below but still stuck and can't work out it out

Code: Select all

<cms:show_repeatable 'about_boxes'>
                             <cms:set my_counter="<cms:zebra '1' '2' '3' />" scope='global' />
                             <cms:if my_counter='1' >
                        <div class="col-md-6">
                           <div class="about-us-post">
                             </cms:if>
                              <div class="skew-box">
                                 <a href="#"><i class="fa fa-building-o"></i></a>
                              </div>
                              <h4><cms:show small_heading/></h4>
                              <span><cms:show small_text/></span>
                           </div>
                                 <cms:if my_counter='4' >
                        </div>
                               </cms:if>
                             </cms:show_repeatable>

The non couchcms coding of the above looks like below

Code: Select all

<div class="col-md-6">
    <div class="about-us-post">
        <div class="skew-box">
             <a href="#"><i class="fa fa-building-o"></i></a>
         </div>
              <h4>Health &amp; Safety Consultancy</h4>
               <span>A competent consultant can provide innovative solutions in respect of the construction health and safety challenges that all organisations experience.</span>
     </div>

          <div class="skew-box">
             <a href="#"><i class="fa fa-building-o"></i></a>
           </div>
           <h4>Inspections</h4>
            <span>Our health and safety inspections comprise of a 1-2 hour visit by a NEBOSH qualified health and safety adviser.</span>
        </div>
        
        <div class="skew-box">
             <a href="#"><i class="fa fa-building-o"></i></a>
         </div>
         <h4>Policies</h4>
         <span>If you employ 5 or more workers then all construction businesses must have a written Health and Safety Policy.</span>
       </div>

       <div class="col-md-6">
               <div class="about-us-post">
                       <div class="skew-box">
                        <a href="#"><i class="fa fa-building-o"></i></a>
                         </div>
                         <h4>PAT Testing</h4>
                         <span>PAT Testing is a simple procedure where all portable appliances contained within the premises are routinely checked to ensure they are safe.</span>
                </div>

                      <div class="skew-box">
                           <a href="#"><i class="fa fa-building-o"></i></a>
                       </div>
                        <h4>Fire Risk Assessment</h4>
                        <span>We are experienced in fire risk assessments and know how to complete this to the health and safety standards.</span>
                  </div>

[KK]

Please see viewtopic.php?p=22909#p22909

Thank you KK but I struggled to follow your example in the post topic as I am unsure how to integrate that into a repeatable region and also was unsure if I need the paginate bits as seems to be more aimed at a blog, sorry

Think I just done it using the following code structure I found on this post viewtopic.php?f=2&t=7697 and tweaked to use the coding I had in

Code: Select all

<cms:show_repeatable 'home_projects' >
    <cms:set my_count="<cms:zebra '1' '2' />" />
    <cms:if my_count='1'>
        <div class="projectEachRow">
    </cms:if>
    
    <!-- display project block here the normal way -->
    
    <cms:if my_count='2' || k_count=k_total_records>
        </div> <!-- /projectEachRow -->
    </cms:if>
</cms:show_repeatable >

Below is the updated code I got

Code: Select all

<cms:show_repeatable 'about_boxes'>
                             <cms:set my_count="<cms:zebra '1' '2' '3' />" />
                                 <cms:if my_count='1'>
                        <div class="col-md-6">
                            </cms:if>
                           <div class="about-us-post">
                              <div class="skew-box">
                                 <a href="#"><i class="fa fa-building-o"></i></a>
                              </div>
                              <h4><cms:show small_heading/></h4>
                              <span><cms:show small_text/></span>
                            </div>     
                             <cms:if my_count='3' || k_count=k_total_records>
                        </div>
                             </cms:if>
                             </cms:show_repeatable>

[KK]

No worries.
Assuming the following definition for the repeatable region -

Code: Select all

<cms:repeatable 'my_repeatable'>
    <cms:editable name='my_text' type='text' />
</cms:repeatable>

Following is the equivalent code of viewtopic.php?p=22909#p22915 adapted for repeatable-regions -

Code: Select all

<cms:set my_max_columns='3' 'global' />

<cms:show_repeatable 'my_repeatable' startcount='1'>
    <cms:if k_first_row  >
        <h5>open</h5>
    </cms:if>
    
    <h3><cms:show my_text /></h3>
    
    <cms:if k_last_row  || "<cms:not "<cms:mod k_count my_max_columns />" />" >
        <h5>close</h5>
        <cms:if "<cms:not k_last_row />" >
            <h5>open</h5>
        </cms:if>
    </cms:if>
</cms:show_repeatable>

Hope this helps.

Sorry think I sorted it using the following code and seems to work ok as checked the source code and is all in the correct place, looks slightly different method to what you posted. Thank you for your help and replies, really appreciate it

Code: Select all

<cms:show_repeatable 'about_boxes'>
                             <cms:set my_count="<cms:zebra '1' '2' '3' />" />
                                 <cms:if my_count='1'>
                        <div class="col-md-6">
                            </cms:if>
                           <div class="about-us-post">
                              <div class="skew-box">
                                 <a href="#"><i class="fa fa-building-o"></i></a>
                              </div>
                              <h4><cms:show small_heading/></h4>
                              <span><cms:show small_text/></span>
                            </div>     
                             <cms:if my_count='3' || k_count=k_total_records>
                        </div>
                             </cms:if>
                             </cms:show_repeatable>