如何创建一个循环，循环更改自定义帖子类型中的每个帖子？

问题描述 投票：0回答：3

如何在WordPress中创建一种类型的循环，其中图像向左或向右移动每个帖子？即第一个帖子图片将被留下，第二个帖子图片将向右，第三个帖子图片将离开，依此类推......

我附上图片。提供一些代码或示例

提前致谢

https://imgur.com/Z58QEjb

enter image description here

<?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">[email protected]</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">[email protected]</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();
?>
wordpress custom-post-type
3个回答
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
投票

您可以按照以下代码

<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
投票

您必须注册您的帖子类型：

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 );
}

循环后：

$args = array( 'post_type' => 'book', 'posts_per_page' => 10 );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
  the_title();
  echo '<div class="entry-content">';
  the_content() . the_thumbnails();
  echo '</div>';
endwhile;

然后你可以制作一些自定义字段，我让你工作

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.