2014-10-02 82 views
1

我試圖在我的非wordpress HTML網站上使用Google Feed API在wordpress博客上顯示最近的博客帖子。 我設法顯示飼料,但現在我堅持讓特色圖片也顯示。目前它只顯示最近10個「頭條新聞」的列表。 下面是代碼:用Google Feed API導入精選圖片

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> 
     <script type="text/javascript" src="http://www.google.com/jsapi"> </script> 
     <script type="text/javascript"> 
      google.load("feeds", "1") 
     </script> 
<script type="text/javascript"> 
         var feedUrl = "http://www.harbordev.com/blog/feed/"; 
         var feedContainer=document.getElementById("feedContainer"); 

         $(document).ready(function() { 
          var feed = new google.feeds.Feed(feedUrl); 
          feed.setNumEntries(10); 
          feed.load(function(result) { 
           list = "<ul>"; 
           if (!result.error){ 
            var posts=result.feed.entries; 
            for (var i = 0; i < posts.length; i++) { 
             list+="<li><a href='" + posts[i].link + "'target=_blank'" + "'>" + posts[i].title + "</a></li>"; 
            } 
            list+="</ul>"; 
            feedContainer.innerHTML = list; 
           } 
           else { 
            feedContainer.innerHTML = "Unable to fetch feed from " + feedUrl; 
           }     
          }); 
         }); 
        </script>    
</head> 

<body> 
<section class="section swatch-white"> 
       <div class="container"> 
       <div class="row"> 
       <div class="col-md-12" id="feedContainer"> 

        </div> 
       </div> 
       </div> 
</section> 
</body 

如何顯示圖像呢?在這裏的一個不同的條目我看到了這樣一個建議:

var bmfx = entry.mediaGroups[0].contents[0].thumbnails[0].url; 

如果這項工作,我會在哪裏插入它?不幸的是,我的JavaScript技能很平庸,因此如果有人能指向我正確的方向或者協助一些代碼,我將不勝感激。

回答

0

您可以看到生成的JSON here的文檔。這些圖像是在內容領域(posts[i].content):

for (var i = 0; i < posts.length; i++) { 
    list+="<li><a href='" + posts[i].link + "'target=_blank'" + "'>" + 
    posts[i].title + "</a><p>" + posts[i].content + "</p></li>"; 
} 

如果你想只顯示圖像,就可以做到這一點與jQuery的

var images = ""; 
$(posts[i].content).find('img').each(function() { 
    images += this.outerHTML; 
}); 

然後代替posts[i].content,追加images變量list

+0

該文檔沒有多說。 – 2014-10-11 02:42:25