Ở phiên bản mới nhất hiện tại mình thấy có lỗi hiển thị bài viết liên quan ( đôi khi xuất hiện, đôi khi lại không xuất hiện), trong khi ở phiên bản trước điều này chưa bao giờ xảy ra.
Ở bài viết này mình xin chia sẻ đoạn code khắc phục lỗi "related post trên template median ui 1.7"
Vào Chủ đề > Chỉnh sửa HTML, tìm mã như bên dưới
<script>/*<![CDATA[*/ /*! Related Post Widget for Blogger by Taufik Nurrohman <https://github.com/taufik-nurrohman> */
!function(e,t,a){if("object"==typeof labelArray&&labelArray.length)for(var l=t.createElement("em"),i=0,s=labelArray.length;i<s;++i)l.innerHTML=labelArray[i],labelArray[i]=l.textContent;var n=(new Date).getTime(),r={widgetTitle:"<h3 class='title'>Related Posts</h3>",widgetStyle:1,homePage:"//www.jagodesain.com",numPosts:6,summaryLength:180,titleLength:"auto",thumbnailSize:300,noImage:"data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=",containerId:"relatedPost",newTabLink:!1,moreText:"Read more",callBack:function(){}};if("object"==typeof relatedPostConfig)for(var i in relatedPostConfig)r[i]=relatedPostConfig[i];r.homePage=r.homePage.replace(/\/?\?m=\d+(\&|$)|\/+$/,"");var o=function(e){var l=t.createElement("script");l.src=e,a.appendChild(l)},m=function(e){var t,a,l=e.length;if(0===l)return!1;for(;--l;)t=Math.floor(Math.random()*(l+1)),a=e[l],e[l]=e[t],e[t]=a;return e},h="object"==typeof labelArray&&labelArray.length?"/-/"+encodeURIComponent(m(labelArray)[0]):"";e["do_related_post_"+n]=function(e){var a,l,i,s,n,ct,dt,Y,M,D,MM,o=t.getElementById(r.containerId),h=m(e.feed.entry),c=r.widgetStyle,d=r.widgetTitle+'<div class="itemR type-'+c+' flex wrap scrlH" role="feed">',u=r.newTabLink?' target="_blank"':"",mm=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];if(o){for(var p=h.length,A=0;A<r.numPosts&&A!==p;A++){l=h[A].title.$t,i="auto"!==r.titleLength&&r.titleLength<l.length?l.substring(0,r.titleLength)+"…":l,s="media$thumbnail"in h[A]&&!1!==r.thumbnailSize?h[A].media$thumbnail.url.replace(/\/s\d+(\-c)?\//,"/s"+r.thumbnailSize+"/"):r.noImage,n="summary"in h[A]&&r.summaryLength>0?h[A].summary.$t.replace(/<br *\/?>/gi," ").replace(/<.*?>/g,"").replace(/[<>]/g,"").substring(0,r.summaryLength)+"…":"",ct=h[A].category[0].term,dt=h[A].published.$t.substring(0, 29),Y=dt.substring(0,4),M=dt.substring(5,7),D=dt.substring(8,10),MM=mm[parseInt(M-1)];for(var f=0,y=h[A].link.length;f<y;f++)if("alternate"==h[A].link[f].rel){a=h[A].link[f].href;break}d+=2==c||3==c?'<article class="flex column"><div class="pI shrink"><a aria-label="Thumbnail" class="image" href="'+a+'"'+u+'><div class="mi lazy" data-style="background-image:url('+s+')"></div></a></div><div class="pC grow flex column"><div class="pH info flex fontM"><time class="time ellips opacity shrink" data-text="'+MM+' '+D+'" datetime="'+dt+'" title="Published on: '+MM+' '+D+', '+Y+'"></time><div class="label ellips cInherit"><a aria-label="Tag" data-text="'+ct+'" href="'+r.homePage+'/search/label/'+ct+'" rel="tag"></a></div></div><div class="pT cInherit"><h4 class="name"><a class="clamp" href="'+a+'"'+u+">"+i+"</a></h4></div></div></article>":4==c?'<article class="flex column shrink"><div class="pI shrink"><a aria-label="Thumbnail" class="image" href="'+a+'"'+u+'><div class="mi lazy" data-style="background-image:url('+s+')"></div></a></div><div class="pC grow flex column"><div class="pH info flex fontM"><time class="time ellips opacity shrink" data-text="'+MM+' '+D+'" datetime="'+dt+'" title="Published on: '+MM+' '+D+', '+Y+'"></time><div class="label ellips cInherit"><a aria-label="Tag" data-text="'+ct+'" href="'+r.homePage+'/search/label/'+ct+'" rel="tag"></a></div></div><div class="pT cInherit"><h4 class="name"><a class="clamp" href="'+a+'"'+u+'>'+i+'</a></h4></div><div class="pS fontM"><div class="snippet clamp opacity">'+n+"</div></div></div></article>":'<article class="flex"><div class="pI shrink"><a aria-label="Thumbnail" class="image" href="'+a+'"'+u+'><div class="mi lazy" data-style="background-image:url('+s+')"></div></a></div><div class="pC grow"><div class="pH info flex fontM"><time class="time ellips opacity shrink" data-text="'+MM+' '+D+'" datetime="'+dt+'" title="Published on: '+MM+' '+D+', '+Y+'"></time><div class="label ellips cInherit"><a aria-label="Tag" data-text="'+ct+'" href="'+r.homePage+'/search/label/'+ct+'" rel="tag"></a></div></div><div class="pT cInherit"><h4 class="name"><a class="clamp" href="'+a+'"'+u+">"+i+"</a></h4></div></div></article>"}o.innerHTML=d+="</div>",r.callBack(e)}},e["do_related_post_start_"+n]=function(e){var t,a,l=e.feed.openSearch$totalResults.$t-r.numPosts,i=(t=1,a=l>0?l:1,Math.floor(Math.random()*(a-t+1))+t);o(r.homePage+"/feeds/posts/summary"+h+"?alt=json-in-script&orderby=updated&start-index="+i+"&max-results="+r.numPosts+"&callback=do_related_post_"+n)},o(r.homePage+"/feeds/posts/summary?alt=json-in-script&orderby=updated&max-results=0&callback=do_related_post_start_"+n)}(window,document,document.getElementsByTagName("head")[0]); /*]]>*/</script>
<script>/*<![CDATA[*/ /*! Related Post Widget for Blogger by Taufik Nurrohman <https://github.com/taufik-nurrohman> */var randomI,callRelated;(function(a,e,l){var t={widgetTitle:"<h3 class='title'>Related Posts</h3>",widgetStyle:1,homePage:"https://www.wendycode.com",numPosts:7,summaryLength:320,titleLength:"auto",thumbnailSize:200,noImage:"data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=",containerId:"relatedPost",newTabLink:false,moreText:"Read more",callBack:function(){}};for(var i in relatedPostConfig){t[i]=relatedPostConfig[i]=="undefined"?t[i]:relatedPostConfig[i]}var s=function(a){var t=e.createElement("script");t.async="async";t.rel="preload";t.src=a;l.appendChild(t)},r=function(a,e){return Math.floor(Math.random()*(e-a+1))+a},n=function(a){var e=a.length,l,t;if(e===0){return false}while(--e){l=Math.floor(Math.random()*(e+1));t=a[e];a[e]=a[l];a[l]=t}return a},c=typeof labelArray=="object"&&labelArray.length>0?"/-/"+n(labelArray)[0]:"",d=function(a){var e=a.feed.openSearch$totalResults.$t-t.numPosts,l=r(1,e>0?e:1);s(t.homePage.replace(/\/$/,"")+"/feeds/posts/summary"+c+"?alt=json-in-script&orderby=updated&start-index="+l+"&max-results="+t.numPosts+"&callback=callRelated")},o=function(a){var l=document.getElementById(t.containerId),i=n(a.feed.entry),s=t.widgetStyle,r=t.widgetTitle+'<div class="itemR type-'+s+' flex wrap scrlH" role="feed">',c=t.newTabLink?' target="_blank"':"",d=t.moreText,o,m,h,u,g;if(!l){return}for(var p=0;p<t.numPosts;p++){if(p==i.length){break}m=i[p].title.$t;h=t.titleLength!=="auto"&&t.titleLength<m.length?m.substring(0,t.titleLength)+"…":m;u="media$thumbnail"in i[p]&&t.thumbnailSize!==false?i[p].media$thumbnail.url.replace(/.*?:\/\//g,"//").replace(/\/s[0-9]+(\-c)?/,"/s"+t.thumbnailSize).replace(/\=s[0-9]+(\-c)?/,"=s"+t.thumbnailSize).replace("1.bp.blogspot.com","2.bp.blogspot.com"):t.noImage;month=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];date=i[p].published.$t.substring(0,10);Y=date.substring(0,4);e=date.substring(5,7);D=date.substring(8,10);M=month[parseInt(e-1)];g="summary"in i[p]&&t.summaryLength>0?i[p].summary.$t.replace(/<br ?\/?>/g," ").replace(/<.*?>/g,"").replace(/[<>]/g,"").substring(0,t.summaryLength)+"…":"";for(var b=0,v=i[p].link.length;b<v;b++){o=i[p].link[b].rel=="alternate"?i[p].link[b].href:"#"}var f=i[0].category[0].term;var y=i[0].published.$t.substring(0,29);if(s==2){r+='<article class="flex column"><div class="pI shrink"><a aria-label="Thumbnail" class="image" aria-label="'+h+'" href="'+o+'" title="'+m+'"><div class="mi lazy" data-style="background-image:url('+u+')"></div></a></div><div class="pC grow flex column"><div class="pH info flex fontM"><time class="time ellips opacity shrink" data-text="'+M+" "+D+'" datetime="'+y+'" title="Published on: '+M+" "+D+", "+Y+'"></time><div class="label ellips cInherit"><a aria-label="Tag" data-text="'+f+'" href="'+t.homePage.replace(/\/$/,"")+"/search/label/"+f+'" rel="tag"></a></div></div><div class="pT cInherit"><h4 class="name"><a class="clamp" aria-label="'+h+'" href="'+o+'" title="'+m+'">'+h+"</a></h4></div></div></article>"}else{if(s==3){r+='<article class="flex"><div class="pI shrink"><a aria-label="Thumbnail" class="image" aria-label="'+h+'" href="'+o+'" title="'+m+'"><div class="mi lazy" data-style="background-image:url('+u+')"></div></a></div><div class="pC grow"><div class="pT cInherit"><h4 class="name"><a class="clamp" aria-label="'+h+'" href="'+o+'" title="'+m+'">'+h+"</a></h4></div></div></article>"}else{if(s==4){r+='<article class="flex column shrink"><div class="pI shrink"><a aria-label="Thumbnail" class="image" aria-label="'+h+'" href="'+o+'" title="'+m+'"><div class="mi lazy" data-style="background-image:url('+u+')"></div></a></div><div class="pC grow flex column"><div class="pH info flex fontM"><time class="time ellips opacity shrink" data-text="'+M+" "+D+'" datetime="'+y+'" title="Published on: '+M+" "+D+", "+Y+'"></time><div class="label ellips cInherit"><a aria-label="Tag" data-text="'+f+'" href="'+t.homePage.replace(/\/$/,"")+"/search/label/"+f+'" rel="tag"></a></div></div><div class="pT cInherit"><h4 class="name"><a class="clamp" aria-label="'+h+'" href="'+o+'" title="'+m+'">'+h+'</a></h4></div><div class="pS fontM"><div class="snippet clamp opacity">'+g+"</div></div></div></article>"}else{r+='<article class="flex column"><div class="pI shrink"><a aria-label="Thumbnail" class="image" aria-label="'+h+'" href="'+o+'" title="'+m+'"><div class="mi lazy" data-style="background-image:url('+u+')"></div></a></div><div class="pC grow flex column"><div class="pH info flex fontM"><time class="time ellips opacity shrink" data-text="'+M+" "+D+'" datetime="'+y+'" title="Published on: '+M+" "+D+", "+Y+'"></time><div class="label ellips cInherit"><a aria-label="Tag" data-text="'+f+'" href="'+t.homePage.replace(/\/$/,"")+"/search/label/"+f+'" rel="tag"></a></div></div><div class="pT cInherit"><h4 class="name"><a class="clamp" aria-label="'+h+'" href="'+o+'" title="'+m+'">'+h+"</a></h4></div></div></article>"}}}}l.innerHTML=r+="</div>";t.callBack()};randomI=d;callRelated=o;s(t.homePage.replace(/\/$/,"")+"/feeds/posts/summary"+c+"?alt=json-in-script&orderby=updated&max-results=0&callback=randomI")})(window,document,document.getElementsByTagName("head")[0]);/*]]>*/</script>
