0

I am using the jQuery Nivo Slider plugin in Wordpress (but not the Wordpress Plugin of the same name) with custom posts, it works perfectly and is simple as pie, EXCEPT it is adding the site root to the image path. I am pulling in an absolute path for my image 

http://www.site.com/images/image.jpg

but Nivo is prepending the site root to the path, which generates:

www.site.com/http://www.site.com/images/image.jpg

I can't find an option in Nivo's documentation to set it to take an absolute path... any ideas??

Here is my template code: 

            <?php global $post;
                 $myposts = get_posts('post_type=homepageslider&numberposts=4&order=asc');
                 foreach($myposts as $post) :
                 setup_postdata($post);?>


                <a href="<?php the_field('link'); ?>"><img src="<?php the_field('image'); ?>" data-thumb="<?php the_field('image'); ?>" /></a>

            <?php endforeach; ?>

a few comments:

  • print_r shows 'image' is echoing this exact path: http://www.mysite.com/wp-content/uploads/product1.jpg (which is correct)
  • when pulled out of the slide code, that loop generates the 4 images perfectly fine with no broken image icon.
  • I tried using a Nivo Slider WP plugin and it worked fine but gave the same issue: broken path, broken link icon (even though the image was loading).

Below is the rendered HTML from the browser. As you can see, the "current slide" path is fine. The problem is with the content in the nivo-slice divs: it's adding an extra root to them. This is the SAME issue I had when using the plugin without any of my custom posts or fields.

<a class="nivo-imageLink" href="http://www.mysite.com/products/product1/" style="display: none;">
<a class="nivo-imageLink" href="http://www.mysite.com/products/product2/" style="display: none;">
<a class="nivo-imageLink" href="http://www.mysite.com/products/product3/" style="display: none;">
<a class="nivo-imageLink" href="http://www.mysite.com/products/product4/" style="display: block;">
<img class="nivo-main-image" src="http://www.mysite.com/wp-content/uploads/product1.jpg" style="display: inline; height: 377px;">

<div class="nivo-caption"></div>

<div class="nivo-slice" name="0" style="left: 0px; width: 971px; height: 377px; opacity: 1; overflow: hidden;">
    <img style="position:absolute; width:971px; height:auto; display:block !important; top:0; left:-0px;" src="www.mysite.com/http://www.mysite.com/wp-content/uploads/product1.jpg">
</div>

(and the div nivo-slice is repeated [name from 0 - 14] with the different slides)

Here is the error being generated in the console (Repeating every time the slider rotates)

GET http://www.mysite.com/http:/www.mysite.com/wp-content/uploads/product1.jpg 404 (Not Found) /http:/www.mysite.com/wp-content/uploads/product1.jpg:1
GET http://www.mysite.com/http:/www.mysite.com/wp-content/uploads/product.jpg 404 (Not Found)

Another Update: I took the wordpress loop out completely and put in 4 static image links. The rotator works fine, shows the images fine, but is having the same issue, broken image icon and prepending the site url to the existing path.

4

2 に答える 2

0

手がかりは、表示される 404 エラー メッセージにあります。

http:/www.mysite.com/wp-content/uploads/product1.jpg

スキームに追加のスラッシュがないため、URL の形式が正しくありません。これは、代わりに相対 URL として解釈されていると思います。

于 2013-03-19T18:01:18.853 に答える
0

プラグイン内で絶対パスを指定できます。Wordpress には既に次のコードが組み込まれています。

$wpDir = ABSPATH;
print_r($wpDir) // path to wp install

表示内容を確認し、それに応じてイメージ パスを調整できます。

于 2013-03-19T17:56:46.063 に答える