隨機焦點文章 Blogger

將 TextList 文字清單小工具轉換為 隨機焦點文章小工具 

您可以直接在清單小工具的設置中添加 多組的文章 URL

把你尚呷意、最喜歡的文章，隨雞展示出來

樣式、若不滿意，請自行使用 CSS 修飾

點按下面 Code 複製 HTML碼：

<b:widget cond='data:view.isHomepage' id='TextList107' locked='false' mobile='yes' title='隨機焦點文章' type='TextList' version='2' visible='true'>
                     <b:includable id='main'>
                       <b:include name='content'/>
   </b:includable>
                    <b:includable id='content'>
<div class='widget-content' style='padding:20px; border:1px solid black;overflow:hidden;background:white; border-radius: 8px;'>
       <a id='plink'>
<h3 id='ptitle'/>
<img align='left' id='pimg' src='' style='width:40%;max-width:380px;max-height:250px; margin-right:20px'/>   
         <div id='pcontent' style='color:black; padding: 5% 20px;'/>  
   </a>
  </div>
 <script type='text/javascript'>
var list =[""];
<b:loop index='i' values='data:items' var='vi'>
 list[<b:eval expr='data:i'/>] = '<data:vi/>';
</b:loop>
var url = list[Math.floor(Math.random()*list.length)+1];
document.getElementById('plink').href=url;
   const src ='<data:blog.homepageUrl/>feeds/posts/summary?alt=json-in-script&amp;callback=showpost&amp;path='+ url;
   // <![CDATA[
document.write("<script type='text/javascript' src='" + src + "'></" + "script>");
function showpost(json) {
    var ent = json.feed.entry[0];
    var src = ent.media$thumbnail ? ent.media$thumbnail.url.replace(/s72/,'s300') : "https://pic.pimg.tw/e717/1610276405-1236476109-g.jpg"; 
document.getElementById('ptitle').innerHTML = ent.title.$t;
document.getElementById('pimg').src = src;
document.getElementById('pcontent').innerHTML = ent.summary.$t.substr(0,200); //內容字數長度
}
  // ]]>
</script>
</b:includable>
                  </b:widget>

按主題  >> 在模板的 HTML 編輯器中添加代碼：

貼在 Blog 小工具上方
<b:widget id='Blog1' locked='true' title='網誌文章' type='Blog' version='2' visible='true'>

儲存模板後，小工具將位於 Blog 項目小工具的正上方。

之後你也可以轉到 [版面配置]窗格，將其移動到你想放置的地方。

編輯文字清單

轉到 [版面配置]窗格 ~ 打開文字清單小工具，在設置中輸入文章的網址，該小工具就會出現在博客上。

注 1：小工具不會檢查列表的內容。如果列表包含不是網址的項目，無法正常工作。

注 2：只會出現一則文章。(其他會隨機顯示)

注 3：在設定 》 網站資訊提供 ~ 允許網誌動態消息 》 ( 要設定成 ) 》完整