help with if else statements
6 posts by 3 authors in: Forums > CMS Builder
Last Post: February 4, 2016 (RSS)
I am using box to display testimonials which has 3 buttons below which swap the testimonial over.
I am well versed at displaying lists of items, however in this instance I need a different class for each of the 3 testimonials. I have tried to achieve this using the code below but it's not working.
Any help appreciated :)
<div class="flex-manual">
<?php foreach ($testimonialsRecords as $record): ?>
<div class="col-xs-12 col-sm-4 wrap">
<?php if ($record['num'] == '1'): ?><div class="switch flex-active">
<?php elseif ($record['num'] == '2'): ?><div class="switch pull-left">
<?php else: ?><div class="switch">
<img alt="client" src="assets/img/people/profile-1.jpg" class="sm-pic img-circle pull-left" width="69" height="70">
<p><span class="highlight"><?php echo htmlencode($record['name']) ?></span><br/><?php echo htmlencode($record['job_title']) ?></p>
<?php endif ?>
<?php endforeach ?>
</div>
The code I am trying to generate. Notice the div class on the second line which needs to be different for each:
<div class="flex-manual">
<div class="col-xs-12 col-sm-4 wrap">
<div class="switch flex-active">
<img alt="client" src="assets/img/people/profile-1.jpg" class="sm-pic img-circle pull-left" width="69" height="70">
<p>
<span class="highlight">AMY WARNER</span><br/>Investor at <span class="highlight">Pear Inc.</span>
</p>
</div>
</div>
<div class="col-xs-12 col-sm-4 wrap">
<div class="switch pull-left">
<img alt="client" src="assets/img/people/profile-2.jpg" class="sm-pic img-circle pull-left" width="69" height="70">
<p>
<span class="highlight">JOHN DOESOME</span><br/>Accountant at <span class="highlight">Vell Inc.</span>
</p>
</div>
</div>
<div class="col-xs-12 col-sm-4 wrap">
<div class="switch">
<img alt="client" src="assets/img/people/profile-1.jpg" class="sm-pic img-circle pull-left" width="68" height="69">
<p>
<span class="highlight">PETER MOOSOME</span><br/>VP Marketing at <span class="highlight">Footbook</span>
</p>
</div>
</div>
By ross - February 1, 2016
Hi there.
Thanks for posting.
I think the issue here will be that you are using $record''num'] because it will likely never actually be "1" or "2". We can go over the "why" of that in more detail if you like.
For now though, I suggest using a counter variable like this instead:
<?php if (@++$counter == '1'): ?>
<div class="switch flex-active">
<?php elseif (@++$counter == '2'): ?>
<div class="switch pull-left">
<?php else: ?>
<div class="switch">
<?php endif ?>
Does that make sense? Give it a shot and let me know how you make out.
Thanks!
Cheers,
Ross Fairbairn - Consulting
consulting@interactivetools.com
Hire me! Save time by getting our experts to help with your project.
Template changes, advanced features, full integration, whatever you
need. Whether you need one hour or fifty, get it done fast with
Priority Consulting: http://www.interactivetools.com/consulting/
Thanks! I tried using this:
<div class="flex-manual">
<?php foreach ($testimonialsRecords as $record): ?>
<div class="col-xs-12 col-sm-4 wrap">
<?php if (@++$counter == '1'): ?>
<div class="switch flex-active">
<?php elseif (@++$counter == '2'): ?>
<div class="switch pull-left">
<?php else: ?>
<div class="switch">
<?php endif ?>
<img alt="client" src="assets/img/people/profile-1.jpg" class="sm-pic img-circle pull-left" width="69" height="70">
<p><span class="highlight"><?php echo htmlencode($record['name']) ?></span><br/><?php echo htmlencode($record['job_title']) ?></p>
</div>
<?php endforeach ?>
</div>
</div>
But it generated this:
<div class="flex-manual">
<div class="col-xs-12 col-sm-4 wrap">
<div class="switch">
<img alt="client" src="assets/img/people/profile-1.jpg" class="sm-pic img-circle pull-left" width="69" height="70" data-pin-nopin="true">
<p><span class="highlight">Bob Smith</span><br>Master trainer</p>
</div>
<div class="col-xs-12 col-sm-4 wrap">
<div class="switch flex-active">
<img alt="client" src="assets/img/people/profile-1.jpg" class="sm-pic img-circle pull-left" width="69" height="70">
<p><span class="highlight">Sam Smith</span><br>Personal trainer</p>
</div>
<div class="col-xs-12 col-sm-4 wrap">
<div class="switch">
<img alt="client" src="assets/img/people/profile-1.jpg" class="sm-pic img-circle pull-left" width="69" height="70">
<p><span class="highlight">Bob Third</span><br>Accountant</p>
</div>
</div>
</div>
:/ any help appreciated
By Damon - February 3, 2016
Hi,
I updated the code. The counter needs to first be set and then incremented outside of the if statement.
<div class="flex-manual">
<?php $counter = 1; ?>
<?php foreach ($testimonialsRecords as $record): ?>
<div class="col-xs-12 col-sm-4 wrap">
<?php if ($counter == '1'): ?>
<div class="switch flex-active">
<?php elseif ($counter == '2'): ?>
<div class="switch pull-left">
<?php else: ?>
<div class="switch">
<?php endif ?>
<img alt="client" src="assets/img/people/profile-1.jpg" class="sm-pic img-circle pull-left" width="69" height="70">
<p><span class="highlight"><?php echo htmlencode($record['name']) ?></span><br/><?php echo htmlencode($record['job_title']) ?></p>
</div>
<?php $counter++; ?>
<?php endforeach ?>
</div>
</div>
Can you give this a try?
Damon Edis - interactivetools.com
Hire me! Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/
That works perfectly, thank you! :)
I have tried to use the above code in a similar situation however I can't get my head around it. I've got a grid of icons that are editable through the CMS so there could be any amount. The problem is they need a div around each set of 4.
I've got the following so far:
<?php foreach ($one_one_iconsRecords as $record): ?>
<div class="col-md-3 col-sm-6 col-xs-12">
<article class="align-center">
<i class="howitworks icon icon-<?php echo htmlencode($record['icon']) ?> highlight"></i>
<span class="heading"><?php echo htmlencode($record['title']) ?></span>
<p class="thin" ><?php echo htmlencode($record['content']) ?></p>
</article>
<!--<span class="icon icon-arrows-04"></span>-->
</div>
<?php endforeach ?>
I need this to appear around every set of 1-4, so if there are 6 icons, I need it to appear around the first 4, and then the last 2
<div class="section-content row animated" data-duration="700" data-delay="200" data-animation="fadeInDown">
</div>
The full code I'm trying to generate:
<div class="section-content row animated" data-duration="700" data-delay="200" data-animation="fadeInDown">
<div class="col-md-3 col-sm-6 col-xs-12">
<article class="align-center">
<i class="howitworks icon-office-44 highlight"></i>
<span class="heading">FEATURE 1</span>
<p class="thin">Sit amet, consectetur adipiscing elit. In hac divisione rem ipsam prorsus probo elegantiam desidero. </p>
</article>
</div>
<div class="col-md-3 col-sm-6 col-xs-12">
<article class="align-center">
<i class="howitworks icon-shopping-18 highlight"></i>
<span class="heading">FEATURE 2</span>
<p class="thin">Sit amet, consectetur adipiscing elit. In hac divisione rem ipsam prorsus probo elegantiam desidero. </p>
</article>
</div>
<div class="col-md-3 col-sm-6 col-xs-12">
<article class="align-center">
<i class="howitworks icon-seo-icons-27 highlight"></i>
<span class="heading">FEATURE 3</span>
<p class="thin">Sit amet, consectetur adipiscing elit. In hac divisione rem ipsam prorsus probo elegantiam desidero. </p>
</article>
</div>
<div class="col-md-3 col-sm-6 col-xs-12">
<article class="align-center">
<i class="howitworks icon-office-24 highlight"></i>
<span class="heading">FEATURE 4</span>
<p class="thin">Sit amet, consectetur adipiscing elit. In hac divisione rem ipsam prorsus probo elegantiam desidero. </p>
</article>
</div>
</div>
<div class="section-content row animated" data-duration="700" data-delay="200" data-animation="fadeInDown">
<div class="col-md-3 col-sm-6 col-xs-12">
<article class="align-center">
<i class="howitworks icon-graphic-design-13 highlight"></i>
<span class="heading">FEATURE 5</span>
<p class="thin">Sit amet, consectetur adipiscing elit. In hac divisione rem ipsam prorsus probo elegantiam desidero. </p>
</article>
</div>
<div class="col-md-3 col-sm-6 col-xs-12">
<article class="align-center">
<i class="howitworks icon-arrows-37 highlight"></i>
<span class="heading">FEATURE 6</span>
<p class="thin">Sit amet, consectetur adipiscing elit. In hac divisione rem ipsam prorsus probo elegantiam desidero. </p>
</article>
</div>
<div class="col-md-3 col-sm-6 col-xs-12">
<article class="align-center">
<i class="howitworks icon-badges-votes-14 highlight"></i>
<span class="heading">FEATURE 7</span>
<p class="thin">Sit amet, consectetur adipiscing elit. In hac divisione rem ipsam prorsus probo elegantiam desidero. </p>
</article>
</div>
<div class="col-md-3 col-sm-6 col-xs-12">
<article class="align-center">
<i class="howitworks icon-badges-votes-16 highlight"></i>
<span class="heading">FEATURE 8</span>
<p class="thin">Sit amet, consectetur adipiscing elit. In hac divisione rem ipsam prorsus probo elegantiam desidero. </p>
</article>
</div>
</div>
By ross - February 4, 2016
Hi there.
I have a code example for you to try. You may need to adjust it a bit but it should get you on the right track
<div class="section-content row animated" data-duration="700" data-delay="200" data-animation="fadeInDown">
<?php foreach ($one_one_iconsRecords as $record): ?>
<div class="col-md-3 col-sm-6 col-xs-12">
<article class="align-center">
<i class="howitworks icon icon-<?php echo htmlencode($record['icon']) ?> highlight"></i>
<span class="heading"><?php echo htmlencode($record['title']) ?></span>
<p class="thin" ><?php echo htmlencode($record['content']) ?></p>
</article>
<!--<span class="icon icon-arrows-04"></span>-->
</div>
<?php if (@++$iconCounter % 4 == 0): ?></div><div class="section-content row animated" data-duration="700" data-delay="200" data-animation="fadeInDown"><?php endif ?>
<?php endforeach ?>
</div>
Things to note in this code:
1. I moved the initial <div> tag outside the foreach loop.
2. I used a different counter name $iconCounter so it doesn't interfere with the other counter we used in the previous code. This is a good thing to remember if you need multiple counters on one page.
Let me know how you make out with this.
Cheers,
Ross Fairbairn - Consulting
consulting@interactivetools.com
Hire me! Save time by getting our experts to help with your project.
Template changes, advanced features, full integration, whatever you
need. Whether you need one hour or fifty, get it done fast with
Priority Consulting: http://www.interactivetools.com/consulting/