On my front page, I want to display pages but with alternate thumbnail sizes. I have 2 thumbnail sizes which should be used.
Page 1: Size A
Page 2: Size B
Page 3: Size A
Page 4: Size A
Page 5: Size A
Page 6: Size B
Page 7: Size A
then start over again with the order.
At the moment, I got the following code, which I want to reuse on other pages of the site to display child pages:
<?php query_posts('post_type=page&order=ASC&post_parent=0');
while(have_posts() ) : the_post(); ?>
<a href="<?php the_permalink() ?>">
<?php the_post_thumbnail(); ?>
<?php the_title(); ?>
</a>
<?php endwhile;?>
Thanks for your help.
It depends on how you decide, which approach to pick. Regarding the order of your pattern, it would make sense, to do it via css. Wordpress also outputs altering classes like even and odd but, since you have Three following (A A A) this is not the right approach. I think easiest is if you use CSS and make us of nth-of-type(int):
/* First Post Type A */
.your-post-type:first-child {
}
/* Second Post Type B*/
.your-post-type:nth-of-type(2) {
}
/* Third Post Type A */
.your-post-type:nth-of-type(3) {
}
/* Fourth Post Type A */
.your-post-type:nth-of-type(4) {
}
/* Fifth Post Type A */
.your-post-type:nth-of-type(5) {
}
/* Sixth Post Type B */
.your-post-type:nth-of-type(6) {
}
/* Seventh Post Type A */
.your-post-type:nth-of-type(7) {
}
If your custom query on the frontpage is not limited to 7, well then you have extend this example up to 14 or how many posts you have and want to show. Limit your query with the last argument shotposts=X:
<?php query_posts('post_type=page&order=ASC&post_parent=0&showposts=14')..
Assuming you already defined your thumbnail sizes (e.g. using add_image_size()) and given that your sequence A B A A A B A seems quite random to me, I'd repeatedly iterate an array with the thumb-sizes to pass them to the_post_thumbnail() function. Something like:
<?php
query_posts('post_type=page&order=ASC&post_parent=0');
$thumbsizes = [
'size-a',
'size-b',
'size-a',
'size-a',
'size-a',
'size-b',
'size-a',
];
$i = 0;
while (have_posts()) : the_post(); ?>
<a href="<?php the_permalink() ?>">
<?php the_post_thumbnail($thumbsizes[ $i ]); ?>
<?php the_title(); ?>
</a>
<?php
$i = ($i + 1) % count($thumbsizes);
endwhile;
?>
Of course, your CSS has something to say on thumbnail sizes too...