WordPress and Anythingslider Navigation Thumbnails

0 Views

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:

Read More
 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!

Post Views: 0

Related posts

Leave a Reply

1 comment

  1. 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">';
}