I've used Couch CMS to create a blog page with index of articles. (Blog_list.html)

I've used Couch for blog systems before and the blog index item always displays underneath each other. However, this time they must display next to each other. I've tried so many things, spending days, but the index items remains under each other oppose to next to each other. The website is based on bootstrap, but the columns just keep on stacking on top of each other.

URL: https://legacyeb.co.za/news.php

Someone, please help!

Code: Select all

<div class="wrapper gray-wrapper">
<cms:pages masterpage='news.php' paginate='1' limit='3'
folder=k_folder_name 
start_on=k_archive_date 
stop_before=k_next_archive_date >

<div class="container">
<div class="row">
<div class="col-lg-4 mt-30"> <!-- bootstrap col start --> 

<div class="post">
<!-- Blog Post -->
<img src="<cms:show blog_image />" class="img-c" alt="News image"> <!-- Post Image -->
<div class="box box-border"> <!-- box custom style 119 -->
<div class="meta"><span class="date"><cms:date k_page_date format='jS M, yy'/></span></div> <!-- Post Date -->
<h2 class="post-title text-center"><a href="<cms:show k_page_link />"><cms:show k_page_title /></a></h2> <!-- Post Title -->
<cms:if k_page_foldertitle >
    <cms:set my_category=k_page_foldertitle />
<cms:else />
    <cms:set my_category='Uncategorised' />
</cms:if>
<div class="post-content text-left">
<p><cms:excerptHTML count='26' ignore='img'><cms:show blog_content /></cms:excerptHTML></p><!-- Post Content -->
<div class="text-center">
<button type="button" class="blog-button btn-full-rounded" onclick="window.location.href='<cms:show k_page_link />'">Read More</button>
</div>
</div><!-- /.post-content --> 
</div><!-- /.box -->
</div><!-- /.post -->
</div><!-- /.bootstrap col end -->
</div><!-- /.row -->
</div><!-- /.container -->

<div class="clearfix"></div>

<div class="space30 d-md-none"></div>

<div class="container">
<div class="row">
<div class="col-lg-12 pagination text-center">
<cms:if k_paginated_bottom >
<!-- Blog Navigation -->
<p class="clearfix">
<cms:if k_paginate_link_prev >
<a href="<cms:show k_paginate_link_prev />" class="tg-btn tg-btnstyletwo float right">&lt;&lt; Newer Posts &nbsp;</a>
</cms:if>
<cms:if k_paginate_link_next >
<a href="<cms:show k_paginate_link_next />" class="tg-btn tg-btnstyletwo float">&nbsp; Previous Posts >></a>
</cms:if>
</p>
</cms:if>
</div>
</cms:pages >
<!-- CMS End -->
</div> <!-- /.row --> 
</div> <!-- /.container -->
</div> <!-- /.wrapper -->

[KK]

I think what seems to be happening is that you have enclosed (within <cms:pages>) a block of HTML code that is unbalanced (i.e. does not have a closing tag for each opening tag). For example, here is your code with the enclosed markup removed -

Code: Select all

<div class="wrapper gray-wrapper">
<cms:pages masterpage='news.php' paginate='1' limit='3' ..>
    .. everything here gets repeated ..
</cms:pages >
<!-- CMS End -->
</div> <!-- /.row --> 
</div> <!-- /.container -->
</div> <!-- /.wrapper -->

As can be seen, whatever gets outputted by cms:pages, the 'row' and 'container' end tags will remain orphaned and this will lead to invalid markup.

Please start afresh with your original HTML markup, isolate *one* full item that needs to be repeated and then enclose it with the <cms:pages> tag.

If you still have difficulty, please post the original HTML code (without any Couch tag added to it) showing at least three-four items that you'd eventually want to be generated by Couch. I'll try to let you know what exactly would be needed to be enclosed by the <cms:pages> tag.

Thanks a million! Your example showed me the way. I had the <cms:pages masterpage='news.php' paginate='1' limit='6'> AND </cms:pages > tags in the wrong place. Working now as expected.

[KK]

I am glad it helped