これまで静的なwebサイトにwordpressの投稿記事をGoogle Feed APIで表示させていたのですが、
jQueryでのRSS表示に切り替えたいと思っています。
他サイトのコードを参考にさせていただいてほぼ表示できたのですが、本文を、画像を含めた全文表示する方法がわからず、
ご教授よろしくお願いいたします。
※フィードの取得はGoogle Feed APIの時は、「content」でよかったと思うのですが、
下のコードでは本文を表示してくれません。
(代わりに「description」にすると抜粋文は読み込んでくれます。)
※また、今もサイトではGoogle Feed APIがちゃんと機能して表示されていますが
やはり近いうちに突然読み込めなくなるのでしょうか?
<script type="text/JavaScript" src="../../js/jquery.js"></script> <script type="text/javascript"> $(function() { var setURL = 'http://example.com/blog/feed'; var setNUM = 10; var setID = 'feed3'; xmlLoad(setURL,setID,setNUM); }); function xmlLoad(_xmlUrl,_id,_num){ DD = new Date();HH = DD.getHours();MM = DD.getMinutes();SS = DD.getSeconds(); var xmlUrl = _xmlUrl+"?"+HH+MM+SS; var main = this; $.ajax({ url: xmlUrl, type: 'GET', dataType: 'xml', timeout: 10000, error: function(){ _msg = 'error'; xmlOpen(_msg,_id,_num); }, success: function(_xml){ main.xml = _xml; _msg = 'load'; xmlOpen(_msg,_id,_num); } }); return; } var xmlOpen = function(_msg,_id,_num){ var main = this; var html = ''; var ID = _id; var Num = _num; if(_msg == 'load'){ xml = main.xml; var channelData = $(xml).find('channel')[0]; $(channelData).find('item').each(function(i){ if(i < Num){ postTitle = $(this).find('title').text(); postLink = $(this).find('link').text(); postContent = $(this).find('content').text(); publishedDate = $(this).find('pubDate').text(); var pubDD = new Date(publishedDate); yy = pubDD.getYear();if (yy < 2000) { yy += 1900; } mm = pubDD.getMonth() + 1;dd = pubDD.getDate(); var postDate = yy +'.'+ mm +'.'+ dd; var postCategory = ''; $(this).find('category').each(function(i){ category = $(this).text(); if(i <= 0){ postCategory += category; }else{ postCategory += ',' + category; } }); html += '<li><h3><a href="' + postLink + '">' + postTitle + '</a></h3>' + postDate + '<br/>' + postContent + '</li>'; } }); }else{ html += '<li>通信fエラー</li>'; } $("#"+ID).html(html); } </script>
---(追記)------------
「content:encoded」の部分のようですが、取得表示する方のコードにそのまま書き込んでもやはり表示できませんでした。
This XML file does not appear to have any style information associated with it. The document tree is shown below. <rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:sy="http://purl.org/rss/1.0/modules/syndication/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/" version="2.0"> <channel> <title>Diary</title> <atom:link href="http://example.com/blog/feed" rel="self" type="application/rss+xml"/> <link>http://example.com/blog</link> <description>by example</description> <lastBuildDate>Sun, 09 Oct 2016 03:09:03 +0000</lastBuildDate> <generator>http://wordpress.org/?v=2.8.6</generator> <language>ja</language> <sy:updatePeriod>hourly</sy:updatePeriod> <sy:updateFrequency>1</sy:updateFrequency> <item> <title>Diary_投稿テスト</title> <link>http://example.com/blog/archives/6</link> <comments>http://example.com/blog/archives/6#comments</comments> <pubDate>Thu, 24 Dec 2009 16:52:17 +0000</pubDate> <dc:creator>example</dc:creator> <category> <![CDATA[ no category ]]> </category> <guid isPermaLink="false">http://example.com/blog/?p=6</guid> <description> <![CDATA[ Diary_投稿テストの 本文と、 写真です。 ]]> </description> <content:encoded> <![CDATA[ <p><span style="color: #000000;">Diary_投稿テストの</span></p> <p><span style="color: #000000;">本文と、</span></p> <div style="word-break: break-all; width: 883.828px; overflow: hidden; font-size: 14.4px;"><span style="color: #000000;"><br style="word-break: break-all;" /><img class="alignnone size-large wp-image-12" title="DSC00000" src="http://example.com/blog/wp-content/uploads/2009/12/DSC00000-500x332.jpg" alt="DSC00000" width="500" height="332" /></span></div> <div style="word-break: break-all; width: 883.828px; overflow: hidden; font-size: 14.4px;">写真です。</div> ]]> </content:encoded> <wfw:commentRss>http://example.com/blog/archives/6/feed</wfw:commentRss> <slash:comments>0</slash:comments> </item> </channel> </rss>
---(追記)------------
「content:encoded」の'encoded'のみにすると全文表示されました。
どうも有難うございました!
回答1件
あなたの回答
tips
プレビュー