1

Google Feed API を使用して、wordpress 以外の HTML サイトに wordpress ブログの最近のブログ投稿を表示しようとしています。なんとかフィードを表示できましたが、注目の画像も表示するのに行き詰まっています。現在、10 件の最近の「見出し」のリストのみが表示されます。コードは次のとおりです。

<!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 スキルは平凡なので、誰かが私を正しい方向に向けたり、コードを支援したりできる場合は、大いに感謝します。

4

1 に答える 1

0

結果の JSON のドキュメントは、こちらでご覧いただけます。画像はコンテンツ フィールド ( 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に追加しますimageslist

于 2014-10-05T07:33:12.340 に答える