最新のブロガー投稿をindex.htmlに埋め込む方法は？

Question

タイトルによれば、私のブロガーの最新の投稿をウェブサイトのindex.htmlに埋め込むことは可能ですか？

ウェブサイトのメインページはhttps://my-domain.com/index.htmlとブログhttps://blog.my-domain.comです。私は私のウェブサイトのメインページの特定の場所に最新のブログ投稿を埋め込みたいと思っています。すなわち、私のブロガーに投稿すると、メインページが自動的に更新されます。

これは可能ですか？

Answer 1

あなたは<div id="latest-post"></div>

<script src='http://your-blog.com/feeds/posts/default?alt=json-in-script&callback=latestPost' async='async'></script> 
<script> 
    function latestPost(json) { 
    var entry = json.feed.entry; 
    for(var i = 0; i < entry.length; i++) { 
     var link, title = entry[i].title.$t; 
     for(var j = 0; j < entry[i].link.length; j++) { 
     if(entry[i].link[j].rel === "alternate") { 
      link = entry[i].link[j].href; 
     } 
     document.getElementById("latest-post").innerHTML += "<a href='" + link + "'>" + title + "</a>"; 
     } 
    } 
    } 
</script> 

Answer 2

最新のポストの場所のため、このようなdiv要素を作成し、あなたのブログのJSONPを使用することができますあなたはiframe Sを使用することができます - これは、単に別のページにページの内容を埋め込みます。たとえば：

<iframe src="http://google.com" width="800" height="800" title="Embed google.com"></iframe> 

しかし、（例えば、クロスサイトスクリプティング）現在、大きなセキュリティリスクをアイフレーム - avoidableしかしFajarが推奨するようにより良いアプローチは、（すなわちデコード、BloggerのAPIからコンテンツをつかむものになるだろうJSONを使用してコンテンツをダウンロードした値に設定します）。

将来、Stack Overflowで質問をするときは、ソリューションに手を差し伸べようとしたコードを含めてください。あなたが何かをする方法がわからない場合は、主題を研究し、プロトタイプのものにjsfiddleなどを使用してください。