I have a table in my database with similar data, but others with more data.
What I want is to echo the data through the loop. my problem is that I want to get data from 2 to 2.
My code to display data normally is
<?php $count = $helper->count('testimony');?>
<div class="owl-4">
<?php for ($i=0; $i < $count; $i++) : ?>
<div class="item">
<?php echo '<h3>'.$helper->get('authorname', $i).'</h3>';
echo '<p>'.$helper->get('testimony', $i).'</p>' ;?>
</div>
<?php endfor; ?>
</div>
This returns
<div class="owl-4">
<div class="item">
<h3>Author 1</h3>
<p>Testimony 1</p>
</div>
<div class="item">
<h3>Author 2</h3>
<p>Testimony 2</p>
</div>
................
</div>
How do I turn gives me this
<div class="owl-4">
<div class="item">
<h3>Author 1</h3>
<p>Testimony 1</p>
<h3>Author 2</h3>
<p>Testimony 2</p>
</div>
<div class="item">
<h3>Author 3</h3>
<p>Testimony 3</p>
<h3>Author 4</h3>
<p>Testimony 4</p>
</div>
................
</div>
THANKS
Just increase the counter by 2 instead of 1 each time.
<?php $count = $helper->count('testimony');?>
<div class="owl-4">
<?php for ($i=0; $i < $count; $i += 2) : ?>
<div class="item">
<?php
echo '<h3>'.$helper->get('authorname', $i).'</h3>';
echo '<p>'.$helper->get('testimony', $i).'</p>' ;
echo '<h3>'.$helper->get('authorname', $i + 1).'</h3>';
echo '<p>'.$helper->get('testimony', $i + 1).'</p>' ;
?>
</div>
<?php endfor; ?>
</div>
You can display <div class="item">and </div> each two iterations, for example checking if $i is an even number:
<?php $count = $helper->count('testimony');?>
<div class="owl-4">
<?php for ($i=0; $i < $count; $i++) : ?>
<?php if ($i%2==0): ?>
<div class="item">
<?php endif; ?>
<?php echo '<h3>'.$helper->get('authorname', $i).'</h3>';
echo '<p>'.$helper->get('testimony', $i).'</p>' ;?>
<?php if ($i%2==0): ?>
</div>
<?php endif; ?>
<?php endfor; ?>
Related
The $counter variable is working fine counting the loop, but I need to get the total amount of elements for each loop. How would I go about doing that?
<div id="<?php echo $term->slug; ?>" class="lity-hide resource-pop-up">
<?php
if($the_posts->have_posts()):
$counter = 1;
while($the_posts->have_posts()):
$the_posts->the_post();
//vars
$section_one = apply_filters('the_content', get_field('section_one'));
$section_two = apply_filters('the_content', get_field('section_two'));
$learn_more_link = get_field('learn_more_link');
?>
<section class="pop-up">
<div class="title">
<div class="brand">
<img src="https://via.placeholder.com/125x125" alt="Brand">
<?php the_title('<h3>','</h3>'); ?>
</div>
<aside>
<h4><?php echo $counter; ?>/<?php echo $counter->length; ?></h4>
</aside>
</div>
<div class="row pop-up-content">
<aside class="col-sm-12 col-md-6">
<?php echo $section_one; ?>
</aside>
<aside class="col-sm-12 col-md-6">
<?php echo $section_one; ?>
</aside>
</div>
<div class="learn-more">Learn More</div>
</section>
<?php
$counter++;
endwhile;
wp_reset_postdata();
endif;
?>
</div>
I should expect (number of element)/(total number of elements) or 2/10, basically like saying 2 of 10.
For the number of posts, you need
echo $the_posts->post_count
which is a total of all the posts, as opposed to
echo $counter->length
$counter is only a number and wouldn't have a length property anyway.
I'm using foundation and Wordpress with Advanced Custom Field to build a services module.
I'm using the repeater field to insert the data.
Currently I have the row element outside of the while loop.
I need the div row to wrap every two "small-6 columns tgs-single-service" divs so the foundation grid displays properly. If I insert the row div in the while statement, it will wrap every single div in a row, which I do not want.
<?php if( have_rows('services_content') ):
$classNumber = 0
?>
<section class="full-width tgs-services-section">
<div class="row">
<?php while( have_rows('services_content') ): the_row(); ?>
<div class="small-6 columns tgs-single-service-<?php echo $classNumber = $classNumber + 1 ?>">
<figure class="effect-goliath">
<?php while( have_rows('service_images') ): the_row(); ?>
<img src="<?php the_sub_field('small_image');?>" srcset="<?php the_sub_field('medium_image');?> 1000w, <?php the_sub_field('large_image');?> 2000w" alt="Byoungz Poet Logo">
<?php endwhile; ?>
<figcaption>
<h3><?php the_sub_field('service_title');?></h3>
<?php the_sub_field('service_text');?>
</figcaption>
</figure>
</div><!-- end service section -->
<?php endwhile; ?>
</div><!--end row -->
</section>
<?php endif; ?>
Currently this displays as:
<div class="row">
<div class="small-6 columns tgs-service-section-1"></div>
<div class="small-6 columns tgs-service-section-2"></div>
<div class="small-6 columns tgs-service-section-3"></div>
<div class="small-6 columns tgs-service-section-4"></div>
</div>
I would like to achieve
<div class="row">
<div class="small-6 columns tgs-service-section-1"></div>
<div class="small-6 columns tgs-service-section-2"></div>
</div>
<div class="row">
<div class="small-6 columns tgs-service-section-3"></div>
<div class="small-6 columns tgs-service-section-4"></div>
</div>
Is there a way to have row wrap every two tgs-single-service divs?
<section class="full-width tgs-services-section">
<div class="row">
<!-- Create a counter i -->
<?php $i=1; while( have_rows('services_content') ): the_row(); ?>
<div class="small-6 columns tgs-single-service-<?php echo $classNumber = $classNumber + 1 ?>">
<figure class="effect-goliath">
<?php while( have_rows('service_images') ): the_row(); ?>
<img src="<?php the_sub_field('small_image');?>" srcset="<?php the_sub_field('medium_image');?> 1000w, <?php the_sub_field('large_image');?> 2000w" alt="Byoungz Poet Logo">
<?php endwhile; ?>
<figcaption>
<h3><?php the_sub_field('service_title');?></h3>
<?php the_sub_field('service_text');?>
</figcaption>
</figure>
</div><!-- end service section -->
<?php if($i % 2 == 0): ?><!-- Check if its divisable by 2 -->
</div>
<div class="row">
<?php endif; ?>
<?php $i++; ?>
<?php endwhile; ?>
</div><!--end row -->
</section>
Declare a counter, then determine if the count is a multiple of 2:
$i = 0;
//during your loop:
if(($i % 2) == 0){
//echo opening and closing tag
}
Please try this:
<?php
if( have_rows('services_content') ):
$classNumber = 0
$rowPerSection = 2;
$rows = get_field('services_content');
$sections = array_chunk($rows, $rowPerSection);
?>
<?php foreach ($sections as $section): ?>
<section class="full-width tgs-services-section">
<div class="row">
<?php foreach ($section as $row): ?>
# code...
<?php endforeach; ?>
</div>
</section>
<?php endforeach; ?>
<?php endif; ?>
I have the following raw HTML code:
<section class="cols services-modern">
<div class="container">
<div class="row-fluid">
<div class="span4">
<i class="content"></i>
<h3>Title</h3>
<p>Blah.....</p>
</div>
<div class="span4">
<i class="content"></i>
<h3>Title</h3>
<p>Blah.....</p>
</div>
<div class="span4">
<i class="content"></i>
<h3>Title</h3>
<p>Blah.....</p>
</div>
</div>
</div>
</section>
Which i would like to loop after the div has been filled with 3 contents.
So far i have done the following with no luck..
<?php for($i = 0; $i < sizeof($content); $i++) : ?>
<section class="cols services-modern">
<div class="container">
<div class="row-fluid">
<?php if($i % 3 == 0): ?>
<div class="span4">
<i class="content"></i>
<h3>Title</h3>
<?= htmlspecialchars_decode($blah); ?>
</div>
<?php else: ?>
<div class="span4">
<i class="content"></i>
<h3>Title</h3>
<?= htmlspecialchars_decode($blah); ?>
</div>
<?php endif; ?>
</div>
</div>
</section>
<?php endfor; ?>
Could anyone help me to spot my mistake, thanks.
This is what u expecting?
<section class="cols services-modern">
<div class="container">
<div class="row-fluid">
<?php for($i = 0; $i < sizeof($content); $i++) : if($i % 3 == 0): ?>
<div class="span4"> <i class="content"></i>
<h3>Title</h3>
<?= htmlspecialchars_decode($blah); ?>
</div>
<?php else: ?>
<div class="span4"> <i class="content"></i>
<h3>Title</h3>
<?= htmlspecialchars_decode($blah); ?>
</div>
<?php endif; endfor; ?>
</div>
</div>
</section>
try this one..
<?php for($i = 0; $i < sizeof($content); $i++) : if($i % 3 == 0): ?>
<section class="cols services-modern">
<div class="container">
<div class="row-fluid">
<div class="span4"> <i class="content"></i>
<h3>Title</h3>
<?= htmlspecialchars_decode($blah); ?>
</div>
<?php else: ?>
<div class="span4"> <i class="content"></i>
<h3>Title</h3>
<?= htmlspecialchars_decode($blah); ?>
</div>
</div>
</div>
</section>
<?php endif; endfor; ?>
I am trying to get a special wordpress loop html output:
<div id="main">
<!-- Line number 1 -->
<div class="article-thumbnail" data-target="article-1" >
<div class="article-open"><img src="" /></div>
</div>
<div class="article-thumbnail" data-target="article-2" >
<div class="article-open"><img src="" /></div>
</div>
<div class="article-thumbnail" data-target="article-3" >
<div class="article-open"><img src="" /></div>
</div>
<div class="container">
<article id="article-1" class="article-entry">
<header class="article-header">
<h2>This is the article 1 text</h2>
</header>
<div class="article-body">
<p>This is the article 1 body</p>
</div>
</article>
<article id="article-2" class="article-entry">
<header class="article-header">
<h2>This is the article 2 text</h2>
</header>
<div class="article-body">
<p>This is the article 2 body</p>
</div>
</article>
<article id="article-3" class="article-entry">
<header class="article-header">
<h2>This is the article 3 text</h2>
</header>
<div class="article-body">
<p>This is the article 3 body</p>
</div>
</article>
</div>
<!-- Line number 2 -->
<div class="article-thumbnail" data-target="article-4" >
<div class="article-open"><img src="" /></div>
</div>
<div class="article-thumbnail" data-target="article-5" >
<div class="article-open"><img src="" /></div>
</div>
<div class="article-thumbnail" data-target="article-6" >
<div class="article-open"><img src="" /></div>
</div>
<div class="container">
<article id="article-4" class="article-entry">
<header class="article-header">
<h2>This is the article 4 text</h2>
</header>
<div class="article-body">
<p>This is the article 4 body</p>
</div>
</article>
<article id="article-5" class="article-entry">
<header class="article-header">
<h2>This is the article 5 text</h2>
</header>
<div class="article-body">
<p>This is the article 5 body</p>
</div>
</article>
<article id="article-6" class="article-entry">
<header class="article-header">
<h2>This is the article 6 text</h2>
</header>
<div class="article-body">
<p>This is the article 6 body</p>
</div>
</article>
</div>
</div>
Check this fiddle file: http://jsfiddle.net/PkZrZ/5/ to get an idea of what I am trying to achieve.
Basically, what I am trying to get from The Wordpress Loop is 1 line of 3 thumbnails (featured post's images) and beneath them post entry for each of that thumbnail, afterwards another line and so on.
I've managed to achieve something, but to be honest, it is incredibly buggy (once it worked, and afterwards it didn't) and seems wrong. Anyway, here is The Wordpress Loop I have so far:
<?php
$post_array = array();
$i = 0;
$j = 0;
$index = 0;
$post_total = $wp_query->post_count; // buggy
/*$post_total = get_term_by('name','ventures','category');
$post_total = $post_total->count;*/
// echo $post_total;
if (have_posts()) : while (have_posts()) : the_post();
$i++;
// echo $i;
$post_array[] = get_object_vars($post);
?>
<div id="post-ventures-image-<?php the_ID();?>" class="post-ventures-image">
<?php the_post_thumbnail( 'hnp-thumb-ventures-180' ); ?>
</div>
<?php if($i%3 == 0 && $post_total >= 3) : ?>
<?php for($j = 0; $j < 3; $j++) : ?>
<article id="post-<?php echo $post_array[$index + $j]['ID'];//the_ID(); ?>" <?php post_class('clearfix'); ?> role="article">
<header class="article-header">
<h3 class="h2"><?php echo $post_array[$index + $j]['post_title'];//the_title(); ?></h3>
</header> <!-- end article header -->
<section class="entry-content clearfix">
<?php echo $post_array[$index + $j]['post_content'];//the_content(); ?>
</section> <!-- end article section -->
</article> <!-- end article -->
<?php endfor; $index = $index + $j; $j = 0; $post_total = $post_total - 3; $i = 0; ?>
<?php elseif($i%2 == 0 && $post_total == 2 ) : ?>
<?php for($j = 0; $j < 2; $j++) : ?>
<article id="post-<?php echo $post_array[$index + $j]['ID'];//the_ID(); ?>" <?php post_class('clearfix'); ?> role="article">
<header class="article-header">
<h3 class="h2"><?php echo $post_array[$index + $j]['post_title'];//the_title(); ?></h3>
</header> <!-- end article header -->
<section class="entry-content clearfix">
<?php echo $post_array[$index + $j]['post_content'];//the_content(); ?>
</section> <!-- end article section -->
</article> <!-- end article -->
<?php endfor; $index = $index + $j ; $j = 0; $post_total = $post_total - 2; $i = 0; ?>
<?php elseif($i%1 == 0 && $post_total == 1) : ?>
<?php for($j = 0; $j < 1; $j++) : ?>
<article id="post-<?php echo $post_array[$index + $j]['ID'];//the_ID(); ?>" <?php post_class('clearfix'); ?> role="article">
<header class="article-header">
<h3 class="h2"><?php echo $post_array[$index + $j]['post_title'];//the_title(); ?></h3>
</header> <!-- end article header -->
<section class="entry-content clearfix">
<?php echo $post_array[$index + $j]['post_content'];//the_content(); ?>
</section> <!-- end article section -->
</article> <!-- end article -->
<?php endfor; $index = $index + $j + 1; $j = 0; $i = 0; ?>
<?php endif;?>
<?php endwhile; ?>
<?php endif; ?>
I think it's out of discussion that this the worst improvized coding ever seen.
If anyone can write me a quick markup on how to write the loop that would be swell :)
Updated:
$posts = get_posts();
$first_three = array_chunk($posts, 3);
$count = 0;
foreach($first_three as $posts){
foreach($posts as $post){?>
<div class="article-thumbnail" data-target="article-1" >
<div class="article-open"><?php echo $post->post_title; ?></div>
</div><?php
}?>
<div class="container"><?php
foreach($posts as $post){$count++?>
<article id="article-<?php echo $count; ?>" class="article-entry">
<header class="article-header">
<h2>This is the article <?php echo $count; ?> text</h2>
</header>
<div class="article-body">
<p>This is the article <?php echo $count; ?> body</p>
</div>
</article><?php
}?>
</div><?php
}
Works perfect for me, just change the markup whatever u need or array.
I have a foreach loop which retrieves the subcategories of the current category.
<?php $_categories = $this->getCurrentChildCategories(); ?>
<?php foreach ($_categories as $_category): ?>
<div class="item">
<?php echo $this->htmlEscape($_category->getName()) ?>
</div>
<?php endforeach; ?>
I want to divide the results in rows of three columns. The desired format is then:
<div class="row">
<div class="item">
content
</div>
<div class="item">
content
</div>
<div class="item">
content
</div>
</div>
<div class="row">
<div class="item">
content
</div>
<div class="item">
content
</div>
<div class="item">
content
</div>
</div>
...
---------------EDIT----------------
My code is now as follows. How and where do i close the row div?
<?php $_categories = $this->getCurrentChildCategories(); ?>
<?php foreach ($_categories as $_category): ?>
<?php if ($i % 3 == 0) { ?>
<div class="row">
<?php } ?>
<div class="item">
<h2><?php echo $this->htmlEscape($_category->getName()) ?> »</h2>
</div>
<?php $i++; endforeach; ?>
---------------EDIT 2----------------
Getting closer. This is the result:
<div class="category-list">
<div class="row"></div>
<div class="row">
<div class="item">
content
</div>
<div class="item">
content
</div>
<div class="item">
content
</div>
</div>
<div class="row">
<div class="item">
content
</div>
<div class="item">
content
</div>
<div class="item">
content
</div>
</div>
<div class="row">
<div class="item">
content
</div>
<div class="item">
content
</div>
<div class="item">
content
</div>
</div>
</div>
How do I get rid of the empty row?
The code is now as follows:
<div class="category-list">
<?php
$i=0;
echo '<div class="row">';
$_categories = $this->getCurrentChildCategories();
foreach($_categories as $_category):
{
if($i %3 ==0)
{ ?>
</div>
<div class="row">
<div class="item">
<h2><?php echo $this->htmlEscape($_category->getName()) ?> »</h2>
</div>
<? }
else
{ ?>
<div class="item">
<h2><?php echo $this->htmlEscape($_category->getName()) ?> »</h2>
</div>
<? }
$i++;
}
endforeach;
?>
</div>
---------------EDIT 3----------------
Solved by hiding the empty row via CSS.
You have to introduce az iterator (?) variable for example $i = 0
if ($i % 3 == 0) { //modulo
// use for whatever you want
}
In every cycle (maybe at the end of it, it depends on your real solution) you have to increment $i (++$i);
Hope this helps
<?php
$i=0;
echo"<div class="row" >
foreach($category as $cat)
{
if($i %3 ==0)
{
echo"</div><div class='row'> <div class='item'> Content </div>";
}
else
{
echo"<div class='item'> Content </div>";
}
$i++;
}
echo"</div>";
?>