Wordpress的图片将用col 4显示。
Wordpress的图片将用col 4显示。
提问于 2018-07-27 07:27:20
嗨，我有很少的图片上传到自定义post类型作为特色图像，在其中，我试图连接引导与Wordpress，并排显示图像在Colo-Md-4。但是当我这样做的时候，它会在新的行中显示图像，而不是显示-md-4。
密码是..。
<?php $loop = new WP_Query( array( 'post_type' => 'portfolio_col_image', 'orderby' => 'post_id' ) );
while($loop->have_posts()) : $loop->the_post(); ?>
<?php
// Must be inside a loop.
if ( has_post_thumbnail() ) { ?>
<div class = "portfolio-column-box">
<div class = "container">
<div class = "col-md-4">
<?php the_post_thumbnail('large', array( 'class' => 'img-thumbnail' ) ); ?>
</div>
</div>
</div>
<?php };
?>
</div>
</div>
<?php endwhile; ?> 回答 4
Stack Overflow用户
发布于 2018-07-27 07:30:55
您有循环问题，容器应该在外部而循环。
<div class = "container">
<?php $loop = new WP_Query( array( 'post_type' => 'portfolio_col_image', 'orderby' => 'post_id' ) );
while($loop->have_posts()) : $loop->the_post(); ?>
<?php
// Must be inside a loop.
if ( has_post_thumbnail() ) { ?>
<div class = "portfolio-column-box">
<div class = "col-md-4">
<?php the_post_thumbnail('large', array( 'class' => 'img-thumbnail' ) ); ?>
</div>
</div>
</div>
<?php };
?>
</div>
<?php endwhile; ?>
</div>以上解决方案基于引导3版本。
如果您使用的是引导程序4，那么还需要包括"row“，如下所示
<div class="container">
<div class="row">
//your loop hereStack Overflow用户
发布于 2018-07-27 07:28:46
你在md-4外面用过吗？？
Stack Overflow用户
发布于 2018-07-27 08:20:04
引导程序4使用"Flex“分隔列，所以我们需要使用行，然后才能使用col，以前的引导版本为col使用浮点数，这样就可以不用行了。
<div class = "portfolio-column-box">
<div class = "container">
<div class="row">
<?php
$loop = new WP_Query( array( 'post_type' => 'product', 'orderby' => 'post_id' ) );
while($loop->have_posts()) : $loop->the_post();
// Must be inside a loop.
if ( has_post_thumbnail() ) { ?>
<div class = "col-md-4">
<?php the_post_thumbnail('large', array( 'class' => 'img-thumbnail' ) ); ?>
</div>
<?php };
endwhile; ?>
</div>
</div>
</div>希望这能解决你的问题。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51552900
复制相关文章
相似问题
腾讯云开发者
