How to Add Recent Posts Widget in blogger
 |
| Recent Posts Widget in blogger |
How to use a code to add a recent post box to a blogger site.
You can add Blogger's Recent Posts on any website as a Widget. today I will share js HTML CSS code for add e widget for the recent post..This will dynamically show your website posts. This means that if you make a new post, it will be added to the widget of that website immediately.
I have shared my code below, here you will put the link of your website and write down how many recent posts you can show.
<style scoped='' type="text/css">
ul#recent-posts{list-style:none;margin:10px 0 0;border:1px solid #ddd;border-radius:7px;padding:5px 0;text-align:left}li.recent-posts{display:block;clear:both;background:#fff;border-bottom:1px solid #ddd;overflow:hidden;list-style:none;word-break:break-word;padding:8px;margin:0 0 5px;line-height:1.7;transition:all .3s}
li.recent-posts:last-child{border-bottom:0}
li.recent-posts a{color:#333;background:transparent}li.recent-posts a:hover{color:#222!important}
</style>
<ul id="recent-posts"></ul>
<script>
//<![CDATA[
var homePage = "https://www.mrlaboratory.info/",
numPosts = 10;
function recentPosts(a){
if(document.getElementById("recent-posts")){var e=a.feed.entry,title,link,content="",ct=document.getElementById("recent-posts");for(var i=0;i<numPosts;i++){for(var j=0;j<numPosts;j++){if(e[i].link[j].rel=="alternate"){link=e[i].link[j].href;break}}var title=e[i].title.$t;content+='<li class="recent-posts"><a href="'+link+'" title="'+title+'" target="_blank">'+title+'</a></li>'}ct.innerHTML=content}}var rcp=document.createElement('script');rcp.src=homePage+'/feeds/posts/summary?alt=json-in-script&orderby=published&max-results='+numPosts+'&callback=recentPosts';document.getElementsByTagName('head')[0].appendChild(rcp);
//]]>
</script>
Hopefully, this will work for you, you can not only use it on Blogger sites, it will work if you put it in any HTML code. thanks 😊😊
recent posts widget,blogger,how to add recent posts widget on blogger,simple recent post widget for blogger,recent post widget for blogger,how to add recent post widget in blogger,recent post by label widget for blogger,recent posts widget for blogger,stylish recent posts widget for blogger,how to add recent posts widget for blogger,recent posts widget with thumbnails blogger,recent posts widget with thumbnails for blogger,recent posts,widget recent post blogger,