在数组中使用这些PHP参数的图像旋转木马
我已经尝试了很长一段时间来创建一个带有下面显示的代码的图像旋转木马,但我似乎无法理解它。当前代码在列表视图中显示所有图像(数组中);有人知道我会怎么做吗在数组中使用这些PHP参数的图像旋转木马,php,wordpress,image,carousel,Php,Wordpress,Image,Carousel,我已经尝试了很长一段时间来创建一个带有下面显示的代码的图像旋转木马,但我似乎无法理解它。当前代码在列表视图中显示所有图像(数组中);有人知道我会怎么做吗 <?php $images = get_custom_field( 'project_pictures' ); if ( is_array( $images ) && ! empty( $images ) ){ foreach( $images as $image ){
<?php
$images = get_custom_field( 'project_pictures' );
if ( is_array( $images ) && ! empty( $images ) ){
foreach( $images as $image ){
$thumbnail_id = get_attachment_id_from_url( $image );
$thumbnail = wp_get_attachment_image( $thumbnail_id );
echo "<a href=\"{$image}\"><img src=\"{$thumbnail}\"></a>";
}
} elseif( ! empty( $images ) ){
$thumbnail_id = get_attachment_id_from_url( $images );
$thumbnail = wp_get_attachment_thumb_url( $thumbnail_id );
echo "<a href=\"{$images}\"><img src=\"{$thumbnail}\"></a>";
//------------------------------------------New code Here//
}
?>
////carousel code
<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block w-100" src=" <?php echo "<a href=\"{$image}\"><img src=\"{$thumbnail}\"></a>";" ?> alt="First slide">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="echo "<a href=\"{$image}\"><img class=\"d-block w-100\" src=\"{$thumbnail}\" alt=\"Slide {$thumbnail_id}\"></a>";" alt="Second slide">
</div>
<div class="carousel-item">
<img class="d-block w-100" src="..." alt="Third slide">
</div>
</div>
</div>
////旋转编码
alt=“第一张幻灯片”>
您正在旋转木马结构之前循环并打印它。。。你需要在旋转木马结构中循环它。。。见:
<?php
// GET CAROUSEL IMAGES ARAY
$images = get_custom_field( 'project_pictures' );
//CHECK IF THERE IS IMAGES
if ( !empty( $images ) ):
?>
<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<?php
//LOOP CAROUSEL IMAGES
foreach( $images as $key => $image ):
$thumbnail_id = get_attachment_id_from_url( $image );
$thumbnail = wp_get_attachment_image( $thumbnail_id );
?>
<div
class="carousel-item <?php
//check if is the first carousel item to activate it
echo ($key==0)?'active':'';?>"
>
<a href="<?php echo $image; ?>">
<img
class="d-block w-100"
src="<?php echo $thumbnail; ?>"
alt="Slide <?php echo $thumbnail_id; ?>"
>
</a>
</div><!-- .carousel-item -->
<?php endforeach; ?>
</div><!-- .carousel-inner -->
</div><!-- .carousel -->
<?php endif; ?>
“在列表视图中显示(数组中)所有图像”是什么意思?。。。这只是一张低于另一张的图片?没错。project_图片最多可以为每个用户添加10个图像。这里是一个链接,它看起来像现在你的代码是正确的,它正在做它应该做的事情。。。我认为你忽略了一个事实,旋转木马需要CSS,也许还需要JavaScript来工作。。。你在css和JS上做什么?你检查过引导转盘了吗?它可以帮助你实现是的,我有。我不知道如何在旋转木马中输出阵列中的每个图片。您基本上可以将其包装在foreach上,如:echo”“代码>。。。你是在制作你自己的旋转木马还是在使用现有的图书馆(比如bootstrap)?你是上帝!非常感谢。