修改WordPress循环以输出包含缩略图的帖子中的所有图像 - Modify WordPress loop to output all images in a post with thumbnails included in the image tag?

这个问题需要一些php，一些jquery和一些一般的编程逻辑。

在之前问题的慷慨帮助下，我建立了一个脚本，扫描WordPress帖子的图像附件，如果发现任何，将这些移动到帖子外部新创建的<ul>中的列表项。这样做的原因是使图像可用于滑块(RoyalSlider)，我硬编码到主题(我不想使用WP插件版本的几个原因)。

你可以在这里看到我正在工作的网站。

同样的脚本提供了网站的几个部分-顶部两个部分的滑块，最后一个部分的客户端徽标。

我现在需要在第二部分的滑块中添加缩略图导航。正如你可以看到的，如果你检查代码，我已经修改了WP循环(在本节的页面模板中)，以便它返回附加到文章的任何图像的缩略图(显然还有图像本身)。

这是我用来做这个的代码:

<?php 
    $images =& get_children( 'post_type=attachment&post_mime_type=image&post_parent=' . $post->ID );
    foreach( $images as $imageID => $imagePost )
    echo wp_get_attachment_image($imageID, 'thumbnail', false);
?>

问题是，这是目前与我的jQuery脚本交互，使这些缩略图得到移动到列表项和包含在滑动条作为图像!相反，我们的目标是将每个缩略图包含在各自图像的<img>标记中，如下所示:

 <img class="rsImg" src="image.jpg" data-rsTmb="small-image.jpg" alt="image description" />

所以这是问题的逻辑部分:让这些缩略图表现得像缩略图而不是图像的最好方法是什么?我怀疑我需要以某种方式在WP页面模板循环中标记它们，然后再将它们"回声"到帖子中，以便其他脚本不会拾取它们?也就是说，也许通过它们作为变量的序列，然后使用我的脚本来检查这些，如果它找到它们，分配给顺序的图像，先到最后?这可能吗?或者有更好的方法来解决这个问题?我可以输出图像和缩略图在所需的代码片段直接从WP循环?

除了基本的include之外，我对如何编写PHP几乎一无所知，所以不能真正尝试这个。

对此的任何帮助都是非常感激的——我知道这个问题是一个艰巨的任务，因为它需要几个领域的专业知识，而且非常具体，但我认为它可能会帮助其他人在类似的情况下，我当然会从知道如何接近/完成这个过程中学到很多!

我不知道我是否理解对了。我明白你不希望缩略图与你的jQuery匹配。

你可以通过修改jquery代码中的匹配元素来解决这个问题。这不是最好的解决方案，但根据你所做的，这是最简单的解决方案。

为缩略图添加一个类:

echo wp_get_attachment_image($imageID, 'thumbnail', false);

echo wp_get_attachment_image($imageID, 'thumbnail', false, array('class' => 'thumbsimg'));

参考:http://codex.wordpress.org/Function_Reference/wp_get_attachment_image

并更改jQuery代码:

var matchesEl = "img, iframe"

var matchesEl = "img:not(.thumbsimg), iframe"

代替

echo wp_get_attachment_image($imageID, 'thumbnail', false);

^返回一个HTML img元素。

使用

wp_get_attachment_image_src( $imageID, $size, $icon );

^返回一个数组，包含图片的Url，宽度，高度。

你的例子:

$images =& get_children( 
               array(
                     'post_type'      => 'attachment',
                     'post_mime_type' => 'image',
                     'post_parent'    => $post->ID,
                     'posts_per_page' => -1
                    )
              );
foreach ( (array) $images as $imageID => $imagePost ) {
   // Getting the full image size and thumbnail
   $thumbnail = wp_get_attachment_image_src( $imageID, 'thumbnail');
   $full = wp_get_attachment_image_src( $imageID, 'full');
   echo '<img class="rsImg" src="'. $full[0] .'" data-rsTmb="'. $thumbnail[0] .'" alt="'. $imagePost->post_content .'" />';
}