Wordpress custom loop posts - php

I want to make a post page in the category.php template.
I want the first post to be a block of 600px by 600px and then 4 posts next to that of all 295px by 295px and the row under that first 4 blocks and than 1 big block etc.
So it will look like this:
can this be achieved with the
<?php while (have_posts()) : the_post(); ?>
loop?
Thanks.

Yeah, you can do this, but you'll want to look at get_posts instead. Check out the examples there, they'll give you something to work with.

Yes. You just need to keep track of whether the big image is on the left or right, and have a count running to tell you which post you're on in the grid/row...and then a way to close out the div tags when the loop is over. Something along these lines:
<?php
$big_left = true;
$items_displayed_in_this_row = 0;
while( have_posts() ){
if( $big_left ){
if( 0 == $items_displayed_in_this_row ){
// Code to put the big image on the left
the_post();
} else {
// Code to put the small images on the right
the_post();
}
} else {
if( 4 == $items_displayed_in_this_row ){
// Code to put the big image on the right
the_post();
} else {
// Code to put the small images on the left
the_post();
}
}
$items_displayed_in_this_row++;
if( 5 == $items_displayed_in_this_row ){
if( $big_left ){
$big_left = false;
} else {
$big_left = true;
}
$items_displayed_in_this_row = 0;
}
}
// While loop just ended. Close out whatever divs might be open.
// eg, if $items_displayed_in_this_row > 0, you're in the middle of a row
// and should close it.
?>
No matter what, it's going to be long and ugly. But doing it in the main loop like this instead of a custom query will allow you to take advantage of pagination, prev/next, etc.

Related

Get on every 4th post in WordPress loop

I am currently trying to a create a feature on my category pages where on every 4th preview post, within the category an advert block is display.
essential it will work the following way:
post 1
post 2
post 3
post 4
ADVERT BLOCK
Post 5
Post 6
In my <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
I have the following:
<?php $i = 0; ?>
<?php if (post_num ($i%4 == 0) < (5 - $featured_count)) : echo "this works"; endif ?>
can someone guide me in the right direction
Your more or less there, here's a quick example just showing some arbitrary text or the post title:
<?php
$counter = 0;
if (have_posts()) {
while (have_posts()) {
$counter++;
the_post();
if ($counter % 5 === 0) {
echo 'Advert Here!';
} else {
the_title();
}
}
}
?>
I haven't tested this, but just to give you an idea.
Edit: I should note that since you're looking to insert the advert after the fourth post, $counter % 4 won't do what you think, if you want to show four posts and then the advert, it would be placed in the 5th "position", hence $counter % 5.

Inserting ads into Jetpack infinite scroll loop

I am creating an infinite scrolling blog and would like ads to be shown every 5 posts. My code is as shown:
<?php
while (have_posts()) : the_post();
if ($i < 4) {
get_template_part( 'content', get_post_format() );
$i++;
} elseif ($i == 4) {
get_template_part( 'ad_template', get_post_format() );
$i=0;
}
endwhile;
?>
This works fine until Jetpack's infinite scrolling takes over and no longer shows the ads at all. I'm wondering if there is a way I can continue to show ads even though after 7 posts Jetpack takes the reigns.
Instead of having two different template parts, try adding that into the 'content' template.
Like so:
if ($i < 4) {
// Your actual post //
$i++;
} if($i == 5) {
// your ad code //
$i=0;
}
That way it should be a part the infinite scroll output. I have not tested this though so can not be 100%

Selecting specific posts with an if statement in a counted loop

I'm currently counting the posts in the loop...
<?php $count = 0; ?>
<?php /* Start the Loop */ ?>
<?php while ( have_posts() ) : the_post(); ?>
<?php $count++; ?>
<?php include(locate_template('content.php')); ?>
<?php endwhile; ?>
But need to select specific posts programmatically in an if statement.
The post count I need to select is 1, 4, 5, 8, 9, 12, 13 etc (+3+1r) in sequence.
How can I select these posts (without having to manually type the numbers)?
While technically off topic for WordPress, I think this is something that a good number ueses will enquire about, particularly those that are new to both WordPress and PHP.
As suggested in the comments to your question, you can use a modulus operator to check this, and hopefully this answer will solve your problem.
<?php
$count = 0;
/* Start the Loop */
while ( have_posts() ) : the_post();
$count++;
if($count % 4 === 0 || $count % 4 === 1) :
locate_template('content.php', true);
endif;
endwhile;
?>
As a side note, the locate_template function will automatically load the template file with require_once (if you set the $load parameter), so you don't need to wrap it in include().
I'd recommended that you check if the template exists, and if not fall back on a theme default that will always be there.

While loop making even/odd blocks with uneven number. Hard code second block

Probably my title is hard to understand, if you can make it more clear for everyone please edit my post thankyou.
So what i did i created a while loop and wanted the blocks going like a X
I have two blocks aside eachother everytime. But i want this X form.
So it will be (block 1) [gray] , (block 2) [darkgray]
and then going (block 1) [darkgray] , (block 2) [gray]. In order to achieve this i made inside my while loop a if function and before the if i created a counter++.
Counter starts at 0 and adds 1 till it gets too 3, because the 3 makes it uneven it will make this X form. But the problem is that the first two blocks will remain gray because of the uneven number 3 at the early on.
Does anyone know how i maybe could hardcode the first two blocks ?.
Also in my code i'm taking the information out of the database in a Descending order.
Its created in wordpress but its more about the php function i made here.
It has to be.
First = Gray
Second = Dark Gray
Third = Dark Gray
Fourth = Gray.
And this should repeat itself whole the time.
enter code here
The code that is already been made(because the code is made in a different language i removed it and replaced with comments for easier understanding) :
global $wp_query;
$temp = $wp_query;
$args = (array(
'post_type' => 'news',
'posts_per_page' => 9999,
'post__not_in' => array(835),
'order' => 'DESC'));
$wp_query = new WP_Query();
$counter = 0;
$wp_query->query($args);
while ($wp_query->have_posts()) :
$wp_query->the_post();
?>
<?php $counter ++;
if($counter == 3) { ?>
/** here comes the dark gray block **/
<?php $counter = 0; ?>
<?php }else { ?>
/** here comes the gray block **/
<?php } ?>
So after alot of help of the community i found my the solution in the end. I feel so stupid that i did not found this out myself. Using this method you will obtain the (Block 1 = Gray),(Block 2 = Dark Gray),(Block 3 = Gray),(Block 4 = Dark Gray).
Solution
<?php $counter ++;
if($counter == 1) { ?>
/** here comes the gray block **/
<?php }else if($counter == 2 { ?>
/** here comes the dark gray block **/
<?php }else if($counter == 3 { ?>
/** here comes the gray block **/
<?php }else if($counter === 4 { ?>
/** here comes the dark gray block **/
<?php $counter = 0; } ?>
So what i did here in the end is i create the 4 first coloring manual and then i reset it just back to zero and let it loop this. since i have a row of two blocks everytime.
instead of using conditions put all the content in parent div and place css for childs like this
<div class="PARENT_DIV">
while ($wp_query->have_posts()) : $wp_query->the_post();
?>
<div id="CHILD_DIV">
YOUR CONTENT
</div>
<?php } ?>
</div>
<style>
.PARENT_DIV:nth-child(odd){ background-color:#eee; }
.PARENT_DIV:nth-child(even){ background-color:#fff; }
</style>
It's simple use modulo
% is modulo operator.
<?php
for($counter=0; $counter<10; ++$counter)
echo (!($counter % 3) ? "gray" : "dark gray").'<br>';
?>
It outputs
gray
dark gray
dark gray
gray
dark gray
dark gray
gray
dark gray
dark gray
gray
As you wanted.
I've created fiddle to show you how it works.
Check fiddle
The other answers have the right ideas but manage to make Zebra stripes, which is not what you asked for. This is a simple solution to show how it works, you need to modify it to suit your style.
I put the colours in an array and then use the modulus operator but with a base of 4 which will return the value of 0,1,2,3,0,1,2,3,0,1... inside your loop. Use that as an index into the array to get the colour.
$colours = array("gray","darkgray","darkgray","gray");
$counter = 0;
while (condition) {
$colour = $colours[$counter % 4];
//your code here
$counter++;
}
You can do it like this also
$colour = "gray";
while (//loop though posts){
$colour = ($colour=="gray")?"darkgray":"gray";
//do something with colour
This needs no extra counter, It just uses the colour variable
This uses the Ternary operator
http://php.net/manual/en/language.operators.comparison.php

Total image widths in while

I have some php code which echos the width of a specific image size in WordPress. Currently, if the image width is greater than 80, then it echos "frog"...what I would like it to do is count all of the image widths within my while and if the total of those images are greater than 600 (hypothetical number) then echo "frog". The code I am using looks like (I am using this code within my while):
<?php
$image = wp_get_attachment_image_src (get_post_thumbnail_id($post_id), 'gallery-thumbnail');
list($width) = getimagesize($image[0]);
echo $width;
if( $width > 80 ) {
echo "frog";
}
?>
My while is the basic WordPress standard:
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<!-- some code here -->
<?php endwhile; else: ?>
<!-- some code here -->
<?php endif; ?>
Any ideas?
Thanks, Josh
Part pseudo code/part solution:
$sumOfWidths = 0;
foreach($images as $image)
{
$sumOfWidths = $sumOfWidths + $image['width'];
}
if($sumOfWidths>600)
{
echo 'frog';
}
Simply put the above code loops through each image and adds the image width to the $sumOfWidths variable.
After the foreach loop, has completed, there should be a number in the $sumOfWidths which you can check and then undertake your logic as you see fit.
Have a look at this code snippet to get you started

Categories