Sorry still stuck on this... anyone have any ideas?

[trendoman]

This is your code stripped, as it should have been posted.

Code: Select all

<cms:pages masterpage='blog.php' paginate='1' limit='6' >
   <div class="hentry-row">
      <article class="loadmore-item col-md-4 col-sm-6 hentry">
         <div class="hentry-wrap">
            <div class="entry-featured image-featured">...</div>
            <div class="entry-info">
               <div class="entry-header">...</div>
               <div class="entry-content">...</div>
            </div>
         </div>
      </article>
   </div>
</cms:pages>

I have removed extra unnecessary </div> right before </cms:pages>.
I see no signs whatsoever of any steps taken after all those advices.
Did you try anything at all? There is no mama around..

[KK]

@srewebso, I'll assume that you did try the solutions offered in this thread but somehow couldn't get them to work with your layout.

So, here is a fully working version of your code using the first solution (though all the others will do the job equally well) -

Stripped down, your code is effectively this -

Code: Select all

<cms:pages masterpage='blog.php' paginate='1' limit='6' >
    <div class="hentry-row">

        <article class="loadmore-item col-md-4 col-sm-6 hentry">
        ....
        </article>

    </div>
                   
    <cms:if k_paginated_bottom >
        <div class="loadmore-action">
            <a href="<cms:show k_paginate_link_next />" class="btn-loadmore">Load More</a>
        </div>
    </cms:if>
</cms:pages>

My solution given early in this thread used 'open' and 'close' as placeholders for markup that opens/closes the row -

Code: Select all

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

<cms:pages masterpage='blog.php'>
    <cms:if k_paginated_top >
        <h5>open</h5>
    </cms:if>
   
    <h3><cms:show k_page_title /></h3>
   
    <cms:if k_paginated_bottom || "<cms:not "<cms:mod k_count my_max_columns />" />" >
        <h5>close</h5>
        <cms:if "<cms:not k_paginated_bottom />" >
            <h5>open</h5>
        </cms:if>
    </cms:if>
</cms:pages>

Replacing the 'open' and 'close' with your markup would yield -

Code: Select all

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

<cms:pages masterpage='blog.php' paginate='1' limit='6'>
    <cms:if k_paginated_top >
        <!-- open row -->
        <div class="hentry-row">
    </cms:if>
   
    <!-- show post -->
    <article class="loadmore-item col-md-4 col-sm-6 hentry">
        <h2><cms:show k_page_title /></h2>
        ..
    </article>
   
    <cms:if k_paginated_bottom || "<cms:not "<cms:mod k_count my_max_columns />" />" >
        <!-- close existing row -->
        </div>

        <cms:if k_paginated_bottom >
            <!-- show paginator -->
            <div class="loadmore-action">
                <a href="<cms:show k_paginate_link_next />" class="btn-loadmore">Load More</a>
            </div>
        <cms:else />
            <!-- open next row -->
            <div class="hentry-row">
        </cms:if>
    </cms:if>
</cms:pages>  

I've added comments in the code above so that you'd find it easier to understand.

Hope it helps.

@srewebso, I'll assume that you did try the solutions offered in this thread but somehow couldn't get them to work with your layout.

So, here is a fully working version of your code using the first solution (though all the others will do the job equally well) -

Stripped down, your code is effectively this -

Code: Select all

<cms:pages masterpage='blog.php' paginate='1' limit='6' >
    <div class="hentry-row">

        <article class="loadmore-item col-md-4 col-sm-6 hentry">
        ....
        </article>

    </div>
                   
    <cms:if k_paginated_bottom >
        <div class="loadmore-action">
            <a href="<cms:show k_paginate_link_next />" class="btn-loadmore">Load More</a>
        </div>
    </cms:if>
</cms:pages>

My solution given early in this thread used 'open' and 'close' as placeholders for markup that opens/closes the row -

Code: Select all

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

<cms:pages masterpage='blog.php'>
    <cms:if k_paginated_top >
        <h5>open</h5>
    </cms:if>
   
    <h3><cms:show k_page_title /></h3>
   
    <cms:if k_paginated_bottom || "<cms:not "<cms:mod k_count my_max_columns />" />" >
        <h5>close</h5>
        <cms:if "<cms:not k_paginated_bottom />" >
            <h5>open</h5>
        </cms:if>
    </cms:if>
</cms:pages>

Replacing the 'open' and 'close' with your markup would yield -

Code: Select all

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

<cms:pages masterpage='blog.php' paginate='1' limit='6'>
    <cms:if k_paginated_top >
        <!-- open row -->
        <div class="hentry-row">
    </cms:if>
   
    <!-- show post -->
    <article class="loadmore-item col-md-4 col-sm-6 hentry">
        <h2><cms:show k_page_title /></h2>
        ..
    </article>
   
    <cms:if k_paginated_bottom || "<cms:not "<cms:mod k_count my_max_columns />" />" >
        <!-- close existing row -->
        </div>

        <cms:if k_paginated_bottom >
            <!-- show paginator -->
            <div class="loadmore-action">
                <a href="<cms:show k_paginate_link_next />" class="btn-loadmore">Load More</a>
            </div>
        <cms:else />
            <!-- open next row -->
            <div class="hentry-row">
        </cms:if>
    </cms:if>
</cms:pages>  

I've added comments in the code above so that you'd find it easier to understand.

Hope it helps.

Ofcourse I did. I'm not in anyway asking for 'free labour' here so find it hard to understand why some people are acting a little petty. Thank you so much for your ongoing support KK I will give this a shot. This should also help a lot of other people out there to provide a different variation to the standard blog list layout.

hi,

a while back I had to use folder images on a similar way (3 images per row), came up with the following

Code: Select all

<cms:set imgcount='3' 'global'/> 
<cms:set imgcounter='0' 'global'/>
<cms:set imgrowcounter='0' 'global'/>

<div class="row"> 
 
   <cms:folders masterpage='blabla.php' orderby='weight' order='desc' >
   <cms:incr imgcounter '1'/>
   <cms:incr imgrowcounter '1'/>
   
      <div>  
        my images  and so on went here ...
      </div>
    
    <cms:if imgrowcounter=='3'>
     </div> 
     <div class="row">
     <cms:set imgrowcounter='0' 'global'/>
     </cms:if>
     <cms:if imgcounter == k_folder_totalchildren >
     </div>
   </cms:if>
  </cms:folders>
</div> 

maybe useful in this respect

Thanks for all the help. Can now confirm I have this all working using the method below !

@srewebso, I'll assume that you did try the solutions offered in this thread but somehow couldn't get them to work with your layout.

So, here is a fully working version of your code using the first solution (though all the others will do the job equally well) -

Stripped down, your code is effectively this -

Code: Select all

<cms:pages masterpage='blog.php' paginate='1' limit='6' >
    <div class="hentry-row">

        <article class="loadmore-item col-md-4 col-sm-6 hentry">
        ....
        </article>

    </div>
                   
    <cms:if k_paginated_bottom >
        <div class="loadmore-action">
            <a href="<cms:show k_paginate_link_next />" class="btn-loadmore">Load More</a>
        </div>
    </cms:if>
</cms:pages>

My solution given early in this thread used 'open' and 'close' as placeholders for markup that opens/closes the row -

Code: Select all

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

<cms:pages masterpage='blog.php'>
    <cms:if k_paginated_top >
        <h5>open</h5>
    </cms:if>
   
    <h3><cms:show k_page_title /></h3>
   
    <cms:if k_paginated_bottom || "<cms:not "<cms:mod k_count my_max_columns />" />" >
        <h5>close</h5>
        <cms:if "<cms:not k_paginated_bottom />" >
            <h5>open</h5>
        </cms:if>
    </cms:if>
</cms:pages>

Replacing the 'open' and 'close' with your markup would yield -

Code: Select all

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

<cms:pages masterpage='blog.php' paginate='1' limit='6'>
    <cms:if k_paginated_top >
        <!-- open row -->
        <div class="hentry-row">
    </cms:if>
   
    <!-- show post -->
    <article class="loadmore-item col-md-4 col-sm-6 hentry">
        <h2><cms:show k_page_title /></h2>
        ..
    </article>
   
    <cms:if k_paginated_bottom || "<cms:not "<cms:mod k_count my_max_columns />" />" >
        <!-- close existing row -->
        </div>

        <cms:if k_paginated_bottom >
            <!-- show paginator -->
            <div class="loadmore-action">
                <a href="<cms:show k_paginate_link_next />" class="btn-loadmore">Load More</a>
            </div>
        <cms:else />
            <!-- open next row -->
            <div class="hentry-row">
        </cms:if>
    </cms:if>
</cms:pages>  

I've added comments in the code above so that you'd find it easier to understand.

Hope it helps.

Ofcourse I did. I'm not in anyway asking for 'free labour' here so find it hard to understand why some people are acting a little petty. Thank you so much for your ongoing support KK I will give this a shot. This should also help a lot of other people out there to provide a different variation to the standard blog list layout.

There is a much simpler solution to this that does not require Couchcms at all. We can use the flex box display properties from CSS. There is no need to complicate this by opening and closing <div> called rows and all major browsers support flex.

Code: Select all

<style>
.grid{
display:flex;
flex-direction: row;
flex-wrap: wrap;
flex-flow: row wrap;
}
.col3{
width:33%;
}
</style>

<div class='grid'>
<cms:pages masterpage='blog.php' paginate='1' limit='6'>   
<article class="lmoadmore-item col-3">
<h2><cms:show k_page_title /></h2>
...
 </article>
 <cms:if k_paginated_bottom >
<div class="loadmore-action">
<a href="<cms:show k_paginate_link_next />" class="btn-loadmore">Load More</a>
</div>
  </cms:if>
</cms:pages>
</div>

Sorry to drag another old post up but I'm finding that when using this method with bootstrap (<div class="row">) as soon as there is a odd number the template messes up because the div row doesn't have the trailing </div>.


Here's my code -

Code: Select all

<cms:set my_max_columns='2' 'global' />
                                    
                                    <cms:pages masterpage='fashion-backpacks.php' paginate='1' limit='6'>
                                     <cms:if k_paginated_top >
                                        <!-- open row -->
                                        <div class="row">
                                    </cms:if>
                                    
                              <div class="col-md-6 col-sm-6">
                                 <div class="grid-post grid-gutter">
                                    <div class="post-image">
                                       <div class="review"><span class="score"><cms:show rating /></span></div>
                                       <div class="post-title">
                                          <div class="post-cat2"><span><cms:show category_teaser /></span></div>
                                          <h2><a href="<cms:show k_page_link />"><cms:show k_page_title /></a></h2>
                                       </div>
                                       <a href="<cms:show k_page_link />"><img src="<cms:show blog_image />" alt="<cms:show k_page_title />"></a>
                                    </div>
                                    <div class="post-body">
                                       <div class="post-meta">
                                          <span><cms:date k_page_date format='jS M, y'/></span> <span>Views: <cms:show page_hits /></span>
                                       </div>
                                       <p><cms:excerptHTML count='50' ignore='img'>   <cms:show blog_content /></cms:excerptHTML></p>
                                    </div>
                                    <div class="read-more"><a href="<cms:show k_page_link />">continue reading</a></div>
                                 </div>
                              </div>
                              
                           <cms:if k_paginated_bottom || "<cms:not "<cms:mod k_count my_max_columns />" />" >
                                        <!-- close existing row -->
                                        </div>
                                     
                                    <cms:if k_paginated_bottom >   
                                    <div class="ot-next-prev-cont">
                                   <div class="ot-prev">
                                    <cms:if k_paginate_link_prev >
                           <a href="<cms:show k_page_link />"><span><i class="fa fa-chevron-left"></i>Previous article</span><strong><cms:show k_page_title /></strong></a>
                                     </cms:if></div>
                                     <div class="ot-next">
                                    <cms:if k_paginate_link_next >
                           <a href="<cms:show k_page_link />"><span>Next article<i class="fa fa-chevron-right"></i></span><strong><cms:show k_page_title /></strong></a>
                                    </cms:if>
                                    </div>
                                    
                                    </cms:if>
                                </cms:if>
                            </cms:pages>

[KK]

Please compare your implementation with the following part of the original code I provided -

Code: Select all

    ..
    ..
    <cms:if k_paginated_bottom || "<cms:not "<cms:mod k_count my_max_columns />" />" >
        <!-- close existing row -->
        </div>

        <cms:if k_paginated_bottom >
            <!-- show paginator -->
            <div class="loadmore-action">
                <a href="<cms:show k_paginate_link_next />" class="btn-loadmore">Load More</a>
            </div>
        <cms:else />
            <!-- open next row -->
            <div class="hentry-row">
        </cms:if>
    </cms:if>
</cms:pages>

You'll see that you have failed to implement the <cms:else /> that opens the next row <!-- open next row -->

Additionally, in your markup the <div class="ot-next-prev-cont"> DIV remains unclosed.

Please try the following. I think it should help -

Code: Select all

    ..
    ..    
    <cms:if k_paginated_bottom || "<cms:not "<cms:mod k_count my_max_columns />" />" >
        <!-- close existing row -->
        </div>

        <cms:if k_paginated_bottom >   
            <!-- show paginator -->
            <div class="ot-next-prev-cont">
                <div class="ot-prev">
                    <cms:if k_paginate_link_prev >
                        <a href="<cms:show k_page_link />"><span><i class="fa fa-chevron-left"></i>Previous article</span><strong><cms:show k_page_title /></strong></a>
                    </cms:if>
                </div>
                
                <div class="ot-next">
                    <cms:if k_paginate_link_next >
                        <a href="<cms:show k_page_link />"><span>Next article<i class="fa fa-chevron-right"></i></span><strong><cms:show k_page_title /></strong></a>
                    </cms:if>
                </div>
            </div>
        <cms:else />
            <!-- open next row -->
            <div class="hentry-row">    
        </cms:if>
    </cms:if>
</cms:pages>