如何在WordPress中创建一种循环，其中每个帖子的图像向左或向右移动？即第一个帖子图像将保留，第二个帖子图像将保留，第三个帖子图像将保留，依此类推...
我附上图片。提供一些代码或示例
预先感谢
<?php
$loop = new WP_Query( array( 'post_type' => 'case_studies') );
$Inc = 1;
if ( $loop->have_posts() ) :
while ( $loop->have_posts() ) : $loop->the_post(); ?>
<?php if($Inc==1){ ?>
<div class="col-sm-3 nopadding">
<?php the_post_thumbnail(); ?>
</div>
<div class="col-sm-3 ">
<h2><?php echo get_the_title(); ?></h2>
</div>
<?php }else if($Inc==2){ ?>
<div class="col-sm-3 nopadding">
<?php the_post_thumbnail(); ?>
</div>
<div class="col-sm-3 ">
<h2><?php echo get_the_title(); ?></h2>
</div>
<?php }else if($Inc==3){ ?>
<div class="item">
<div class="col-sm-6 nopadding">
<?php the_post_thumbnail(); ?>
</div>
<div class="col-sm-6">
<h2><?php echo get_the_title(); ?></h2>
</div>
</div>
<?php }else if($Inc==4){ ?>
<div class="item">
<div class="col-sm-6 nopadding">
<?php the_post_thumbnail(); ?>
</div>
<div class="col-sm-6">
<h2><?php echo get_the_title(); ?></h2>
</div>
</div>
<?php } ?>
<?php
if($Inc==4){
$Inc =1;
}
$Inc++;
endwhile;
endif;
wp_reset_postdata();
？>
<?php
$loop = new WP_Query( array( 'post_type' => 'team') );
if ( $loop->have_posts() ) :
$Inc = 0; //start your counter
while ( $loop->have_posts() ) : $loop->the_post();
$person_image = get_field('person_image');
$person_description = get_field('person_description');
?>
<?php if($Inc % 2 == 0){ //if $inc can be created by multiplying 2.?>
<div class="col-md-12">
<div class="col-md-1">
<div>
<img src="<?php bloginfo('template_url'); ?>/images/dot1.png" class="img-responsive dotimages">
</div>
</div> <!--.col-md-1 -->
<div class="col-md-10 row">
<div class="clientimagesarea">
<div class="col-md-6">
<div>
<img src="<?php echo $person_image; ?>" class="img-responsive center-block peopleimages">
<?php //the_post_thumbnail(); ?>
</div>
</div>
<div class="col-md-6">
<div class="clienttext clienttextmarleft">
<?php echo $person_description; ?>
</div>
<div class="col-md-12">
<div class="row ">
<div class="col-md-12 col-xs-12 col-sm-12 paddmargin0">
<div class="col-md-2 col-sm-2 col-xs-4">
<div><img src="<?php bloginfo('template_url'); ?>/images/email-icon2.png" class="img-responsive clientemailicon text-left"></div>
</div>
<div class="col-md-9 col-sm-9 col-xs-8">
<div class="emailid">abx@sitename.com</div>
</div>
</div>
<div class="col-md-12 col-xs-12 col-sm-12 paddmargin0">
<div class="col-md-2 col-sm-2 col-xs-4">
<div><img src="<?php bloginfo('template_url'); ?>/images/call-icon2.png" class="img-responsive clientemailicon2 "></div>
</div>
<div class="col-md-9 col-sm-9 col-xs-8">
<div class="emailid2">+41 79 777 66 45</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<?php //the_post_thumbnail(); ?>
</div>
<?php }else { //it cant?>
<div class="row col-md-6 col-md-offset-3">
<div class="deviderline">
</div>
</div>
<div class="col-md-12">
<div class="row col-md-10 col-md-offset-1">
<div class="row clientimagesarea">
<div class="col-md-6">
<div class="clienttext">
<p>
<?php echo $person_description; ?>
</p>
</div>
<div class="col-md-12">
<div class="row iconmarginleft">
<div class="col-md-12 col-xs-12 col-sm-12 paddmargin0">
<div class="col-md-2 col-sm-2 col-xs-4">
<div><img src="<?php bloginfo('template_url'); ?>/images/email-icon2.png" class="img-responsive clientemailicon text-left"></div>
</div>
<div class="col-md-9 col-sm-9 col-xs-8">
<div class="emailid">abx@sitename.com</div>
</div>
</div>
<div class="col-md-12 col-xs-12 col-sm-12 paddmargin0">
<div class="col-md-2 col-sm-2 col-xs-4">
<div><img src="<?php bloginfo('template_url'); ?>/images/call-icon2.png" class="img-responsive clientemailicon2 "></div>
</div>
<div class="col-md-9 col-sm-9 col-xs-8">
<div class="emailid2">+91 1234567890</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div>
<img src="<?php echo $person_image; ?>" class="img-responsive center-block peopleimages clienttextmarleft">
</div>
</div>
</div>
</div>
<div class="col-md-1">
<div>
<img src="<?php bloginfo('template_url'); ?>/images/dot3.png" class="img-responsive dotimage3">
</div>
</div>
</div>
<?php } ?>
<?php
$Inc++;
endwhile;
endif;
wp_reset_postdata();
?>
答案 0 :(得分：2)
您可以按照以下代码
<div class="row">
<?php
$category = get_the_category();
$slug = $category[0]->slug;
$args = array(
'post_type' => 'post',
'category_name'=>$slug,
'posts_per_page'=> 1,
);
$query = new WP_Query( $args );
while ( $query->have_posts() ) : $query->the_post();?>
<div class="container">
<div class="img-box">
<?php echo get_the_post_thumbnail(get_the_ID());?>
</img>
</div>
<div class="content">
<?php
$content = get_the_content();
echo wp_trim_words( get_the_content(), 25, '' );
?>
</div>
</div>
<?php endwhile; ?>
</div>
.container{
display: flex;
flex-wrap: wrap;
align-content: space-between;
margin-bottom:40px;
}
.img-box{
width:40%;
}
img{
max-width:100%;
}
.content{
width:60%
}
.container:nth-child(even){
flex-direction: row-reverse;
}<div class="row">
<div class="container">
<div class="img-box">
<img src="https://dummyimage.com/600x400/000/fff">
</div>
<div class="content">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et.
</div>
</div>
<div class="container">
<div class="img-box">
<img src="https://dummyimage.com/600x400/000/fff">
</div>
<div class="content">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et.
</div>
</div>
答案 1 :(得分：1)
您的逻辑是有道理的，我还没有测试过，但这应该使您的代码每隔第二步就完成一次。
<?php
$loop = new WP_Query( array( 'post_type' => 'case_studies') );
if ( $loop->have_posts() ) :
$Inc = 0; //start your counter
while ( $loop->have_posts() ) : $loop->the_post(); ?>
<?php if($Inc % 2 == 0){ //if $inc can be created by multiplying 2.?>
<div class="col-sm-3 nopadding">
<?php the_post_thumbnail(); ?>
</div>
<div class="col-sm-3 ">
<h2><?php echo get_the_title(); ?></h2>
</div>
<?php }else { //it cant?>
<div class="col-sm-3 ">
<?php echo get_the_title(); ?>
</div>
<div class="col-sm-3 nopadding">
<h2><?php the_post_thumbnail(); ?></h2>
</div>
<?php }
$Inc++; //increment the counter
endwhile;
endif;
wp_reset_postdata();
答案 2 :(得分：-1)
您必须像这样注册您的帖子类型：
cy.get('.myClass')
.then($els => {
// get Window reference from element
const win = $els[0].ownerDocument.defaultView
// use getComputedStyle to read the pseudo selector
const before = win.getComputedStyle($els[0], 'before')
// read the value of the `content` CSS property
const contentValue = before.getPropertyValue('content')
// the returned value will have double quotes around it, but this is correct
expect(contentValue).to.eq('"foo-"')
})
，循环之后是：
add_action( 'init', 'codex_book_init' );
/**
* Register a book post type.
*
* @link http://codex.wordpress.org/Function_Reference/register_post_type
*/
function codex_book_init() {
$labels = array(
'name' => _x( 'Books', 'post type general name', 'your-plugin-textdomain' ),
'singular_name' => _x( 'Book', 'post type singular name', 'your-plugin-textdomain' ),
'menu_name' => _x( 'Books', 'admin menu', 'your-plugin-textdomain' ),
'name_admin_bar' => _x( 'Book', 'add new on admin bar', 'your-plugin-textdomain' ),
'add_new' => _x( 'Add New', 'book', 'your-plugin-textdomain' ),
'add_new_item' => __( 'Add New Book', 'your-plugin-textdomain' ),
'new_item' => __( 'New Book', 'your-plugin-textdomain' ),
'edit_item' => __( 'Edit Book', 'your-plugin-textdomain' ),
'view_item' => __( 'View Book', 'your-plugin-textdomain' ),
'all_items' => __( 'All Books', 'your-plugin-textdomain' ),
'search_items' => __( 'Search Books', 'your-plugin-textdomain' ),
'parent_item_colon' => __( 'Parent Books:', 'your-plugin-textdomain' ),
'not_found' => __( 'No books found.', 'your-plugin-textdomain' ),
'not_found_in_trash' => __( 'No books found in Trash.', 'your-plugin-textdomain' )
);
$args = array(
'labels' => $labels,
'description' => __( 'Description.', 'your-plugin-textdomain' ),
'public' => true,
'publicly_queryable' => true,
'show_ui' => true,
'show_in_menu' => true,
'query_var' => true,
'rewrite' => array( 'slug' => 'book' ),
'capability_type' => 'post',
'has_archive' => true,
'hierarchical' => false,
'menu_position' => null,
'supports' => array( 'title', 'editor', 'author', 'thumbnail', 'excerpt', 'comments' )
);
register_post_type( 'book', $args );
}
然后您可以创建一些自定义字段 我让你努力