Wordpress 和 Anythingslider 导航缩略图

发布于 2024-10-10 21:59:14 字数 1005 浏览 1 评论 0原文

所以我在 WordPress 中使用 AnythingSlider。这就是为什么我试图从原始帖子中调用缩略图。任何滑块都会像这样配置缩略图导航：

function formatText(index, panel) {
  return index + "";
}

$(function () {

    $('.anythingSlider').anythingSlider({
        navigationFormatter: formatText       // Details at the top of the file on this use (advanced use)
    });

});

如您所见，navigationFormatter 将允许我根据需要格式化导航（包括缩略图）。例如，要格式化缩略图，我可以这样做：

 navigationFormatter : function(i, panel){ // add thumbnails as navigation links
return '<img src="images/th-slide-' + ['civil-1', 'env-1', 'civil-2', 'env-2'][i - 1] + '.jpg">';

} 所以我的问题是让 WordPress 幻灯片图像动态显示在那里，而不是显示在文件夹中（如上面的示例所示）。作为参考，这是我的 php 查询，它正在提取帖子图像（来自我已经编写的脚本：

    <img class="slider-img" style="float:left;" src="<?php if(function_exists('wp_get_post_image')){ echo wp_get_post_image(array( 'return_html' => false, 'width' => 500 )); } ?>" />

我希望此更新有所帮助。非常感谢你们。Stack Overflow 社区很棒！

原文

So I am using AnythingSlider in Wordpress. This is why I am trying to call the thumbnails from the original posts. Anything slider will configure thumbnail navigation like this:

function formatText(index, panel) {
  return index + "";
}

$(function () {

    $('.anythingSlider').anythingSlider({
        navigationFormatter: formatText       // Details at the top of the file on this use (advanced use)
    });

});

As you can see, the navigationFormatter will allow me to format the nav (including thumbnails) however I want. For example, to format thumbnails, I could do this:

 navigationFormatter : function(i, panel){ // add thumbnails as navigation links
return '<img src="images/th-slide-' + ['civil-1', 'env-1', 'civil-2', 'env-2'][i - 1] + '.jpg">';

}
So my issue is getting the wordpress slide images to show up there dynamically, rather than in a folder (as the above example shows). For reference, this is my php query that is pulling the posts image (from a script I've already written:

    <img class="slider-img" style="float:left;" src="<?php if(function_exists('wp_get_post_image')){ echo wp_get_post_image(array( 'return_html' => false, 'width' => 500 )); } ?>" />

I hope this update helps. Thank you guys so much. The Stack overflow community is great!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

几味少女 2024-10-17 21:59:14

您可以使用与设置 everythingSlider 内容的 LI 相同的循环来设置 JS 数组，然后在 jQuery 调用之前回显它，或者使用类似以下内容的内容：

$thumbArrStr = "[";
foreach($yourThumbData as $k=>$v) {
    $thumbArrStr .= "'$v',";
}
$thumbArrStr = substr($thumbArrStr, 0, -1);
$thumbArrStr .= "]";
echo "var anythingSliderArr = $thumbArrStr;";

现在使用 anythingSliderArr：

navigationFormatter : function(i, panel){ // add thumbnails as navigation links
    return '<img src="images/th-slide-' + anythingSliderArr[i - 1] + '.jpg">';
}

You can use the same loop that is setting your anythingSlider content's LI to set a JS array and then echo it before your jQuery calls or using something like:

$thumbArrStr = "[";
foreach($yourThumbData as $k=>$v) {
    $thumbArrStr .= "'$v',";
}
$thumbArrStr = substr($thumbArrStr, 0, -1);
$thumbArrStr .= "]";
echo "var anythingSliderArr = $thumbArrStr;";

And now use anythingSliderArr:

navigationFormatter : function(i, panel){ // add thumbnails as navigation links
    return '<img src="images/th-slide-' + anythingSliderArr[i - 1] + '.jpg">';
}

回复收藏 0 原文

~没有更多了~