• twitter image
  • facebook image
  • youtube image
  • linkedin image
Language: CMS Made Simple Czech CMS Made Simple France CMS Made Simple Spain CMS Made Simple Hungary CMS Made Simple Russia CMS Made Simple Netherlands

All times are UTC




Post new topic Reply to topic  [ 7 posts ] 
Author Message
 Post subject: Gallery and Bootstrap Rows and Columns
PostPosted: Wed Nov 15, 2017 10:03 pm 
Offline
Forum Members
Forum Members

Joined: Fri Feb 24, 2012 12:57 pm
Posts: 38
Hello,

Is it possible to edit the templates (in my case the Lightbox) to use rows of 3 columns in the foreach loop?

So something like:
Code:
{loop for every 3 images}
<div class="row">
{foreach from=$images item=image}
<div class="col-md-4">Image Stuff</div>
{/foreach}
</div>
{/loop}

Hope that makes sense. Thanks in advance.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: Gallery and Bootstrap Rows and Columns
PostPosted: Thu Nov 16, 2017 5:29 pm 
Offline
Forum Members
Forum Members

Joined: Fri May 27, 2011 9:37 am
Posts: 50
Yes you can do that!

Tip use the smarty @iteration or @index in the foreach loop.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: Gallery and Bootstrap Rows and Columns
PostPosted: Thu Nov 16, 2017 6:28 pm 
Offline
Forum Members
Forum Members

Joined: Fri Feb 24, 2012 12:57 pm
Posts: 38
Many thanks for the tip @Rinker!

If it helps others, I was able to make it work using this in my Gallery template
Code:
<div class="gallery">
<div class="row img">
{foreach from=$images item=image name='featured'}

<div class="col-md-4">
<a href="{$image->file|escape:'url'|replace:'%2F':'/'}" data-title="{$image->titlename}" data-lightbox="cmsmsgallery{$galleryid}"><img src="{$image->thumb|escape:'url'|replace:'%2F':'/'}" alt="{$image->titlename}" class="img-responsive" /></a>
<h2>{$image->titlename}</h2>
<p><strong><em>{$image->fields.credits.value}</em></strong></p>
<p>{$image->comment|strip_tags|escape:'html'}</p>
</div>

{if $smarty.foreach.featured.iteration is div by 3}
</div><div class="row img">
{/if}

{/foreach}
<div class="galleryclear">&nbsp;</div>
</div>
</div>

This will be super helpful in other modules as well.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: Gallery and Bootstrap Rows and Columns
PostPosted: Fri Nov 17, 2017 4:43 pm 
Offline
Dev Team Member
Dev Team Member

Joined: Mon Nov 28, 2011 9:29 am
Posts: 2871
Location: The Netherlands
Consider adding a check for 'div by 3 and NOT last' else you could end up having one additional, empty row.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: Gallery and Bootstrap Rows and Columns
PostPosted: Tue Nov 21, 2017 1:24 pm 
Offline
Forum Members
Forum Members

Joined: Fri Feb 24, 2012 12:57 pm
Posts: 38
velden wrote:
Consider adding a check for 'div by 3 and NOT last' else you could end up having one additional, empty row.


Not sure I understand. Could you show me the mark up example?


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: Gallery and Bootstrap Rows and Columns
PostPosted: Tue Nov 21, 2017 1:54 pm 
Offline
Dev Team Member
Dev Team Member

Joined: Mon Nov 28, 2011 9:29 am
Posts: 2871
Location: The Netherlands
Code:
{if $smarty.foreach.featured.iteration is div by 3 && !$smarty.foreach.featured.last}
</div><div class="row img">
{/if}


or

Code:
{if $image@iteration is div by 3 && !$image@last}
</div><div class="row img">
{/if}


https://www.smarty.net/docs/en/language ... perty.last


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: Gallery and Bootstrap Rows and Columns
PostPosted: Tue Nov 21, 2017 2:27 pm 
Offline
Forum Members
Forum Members

Joined: Fri Feb 24, 2012 12:57 pm
Posts: 38
Thanks velden!


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 7 posts ] 

All times are UTC


Who is online

Users browsing this forum: No registered users


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
HostPapa CMS Made Simple hosting