Review Style Recent Comments Blogger Widget
close
Review Style Recent Comments Blogger Widget

Review Style Recent Comments Blogger Widget

Review Style Recent Comments Blogger Widget

Hello what's up blogger users and today I am going to share with you recent comments blogger widget. This is review style recent comments blogger widget and looks amazing.

This widget grabs all the recent comments from your blogspot blog and show them. If your website has beautiful appearance then it will attract your visitors and your visitors will be bound to come back again to your website & this widget is very much beautiful and responsive and I think it might give you more visitors if someone visit your blog then he/she will definitely come back again.

If you want to add a this widget on your blogger blog you have to follow the steps which are provided below.

Steps to make Review Style Recent Post Blogger Widget:

    You should have jQuery plugin installed on your website or blog if you don't have yet install it by pasting the code provided below after <head> in your blogger Template code.
    To install jquery if not already: <script src="https://cdn.ahrefs.com/assets/js/jquery.min.js"></script>
  1. Go To Blogger Dashboard
  2. Then Go to Theme / Template
  3. Click Edit HTML Button
  4. Now copy the code provided below
  5. Now search for </head>
  6. To Search anything in blogger Press Ctrl + F and type or paste the term to search in search bar.
  7. Save Theme / Template
  8. Now go to Layout Section in your blogger dashboard.
  9. Click Add New Widget where you want to place this widget.
  10. Now copy the code provided below and paste it as the widget content which we have created in above step.
  11. <div class="generic-container"> 
    <script>    
    var ListCount = 6;       
    var ChrCount = 100;
    var website = 'https://www.softwebtuts.com';
    function cmts(json) {       
    document.write('<div id="biziqrecentreviews-5"> <span style="display:none" id="dt">5</span>');       
    for (var i = 0; i < ListCount; i++){var listing= ListImage = ListUrl = ListDate = TotalPosts = ListTitle = ListImage = ListContent = ListConten = ListAuthor = ListTag = ListProfile = ListComments = thumbUrl = sk = ListMonth = Y = D = M = m =  "";for (var j = 0; j < json.feed.entry[i].link.length; j++) {if (json.feed.entry[i].link[j].rel == 'alternate') {break;}}if(json.feed.entry[i].link[2] != null){ListUrl= "'" +json.feed.entry[i].link[j].href + "'";}else{ListUrl = "'#'"}if(json.feed.entry[i].link[2] != null){var sts_slit = json.feed.entry[i].link[j].href;var M_slit = sts_slit.split("#");M_slit = M_slit [0];var K_slit = M_slit.split("?");K_slit = K_slit[0];var B_slit = K_slit.split("/");B_slit = B_slit[5];B_slit = B_slit.split(".html");B_slit = B_slit [0];var T_slit= B_slit.replace(/-/g, " ").charAt(0).toUpperCase()+ B_slit.replace(/-/g, " ").slice(1).substring(0, 50);var Link_slit= T_slit.link(K_slit);}TotalPosts = json.feed.openSearch$totalResults.$t;ListAuthor= json.feed.entry[i].author[0].name.$t;var ListAuth = ListAuthor.split(" ");var ListAuth = ListAuth.slice(0, 1).join(" ");ListProfile= "'" + json.feed.entry[i].author[0].uri.$t + "'";ListConten = json.feed.entry[i].content.$t;ListContent= ListConten.replace(/(<([^>]+)>)/ig,"").substring(0, ChrCount);ListMonth= ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];ListDate= json.feed.entry[i].published.$t.substring(0, 10);Y = ListDate.substring(0, 4);m = ListDate.substring(5, 7);D = ListDate.substring(8, 10);M = ListMonth[parseInt(m - 1)];if (json.feed.entry[i].author){       thumbUrl = json.feed.entry[i].author[0].gd$image.src;sk= thumbUrl.replace("/s72-c/","/s60-c/");ListImage= "'" + sk + "'";}else{ListImage= "'https://lh3.googleusercontent.com/-SQuC6xQApOY/XHfNgD4_Q0I/AAAAAAAAAx8/xGAmPp-Fr545UyQ0hOZT-bRtRq3nZGmQQCLcBGAs/nothumb.png'";     }var listing = '<div class="biziq-review" ><div><div class="review-info"> <span class="review-date">'+ M +" "+ D +", "+ Y +'</span><a href="https://www.softwebtuts.com" class="credit">ⓘ<span class="tooltiptext">This widget is made by <strong>M.Muzammil</strong></span></a><span class="author-name">'+ListAuthor+'</span><span class="review-rating"><svg class="svg-inline--fa fa-star fa-w-18 final-star" aria-hidden="true" data-prefix="fa" data-icon="star" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" data-fa-i2svg=""><path fill="currentColor" d="M259.3 17.8L194 150.2 47.9 171.5c-26.2 3.8-36.7 36.1-17.7 54.6l105.7 103-25 145.5c-4.5 26.3 23.2 46 46.4 33.7L288 439.6l130.7 68.7c23.2 12.2 50.9-7.4 46.4-33.7l-25-145.5 105.7-103c19-18.5 8.5-50.8-17.7-54.6L382 150.2 316.7 17.8c-11.7-23.6-45.6-23.9-57.4 0z"></path></svg><svg class="svg-inline--fa fa-star fa-w-18 final-star" aria-hidden="true" data-prefix="fa" data-icon="star" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" data-fa-i2svg=""><path fill="currentColor" d="M259.3 17.8L194 150.2 47.9 171.5c-26.2 3.8-36.7 36.1-17.7 54.6l105.7 103-25 145.5c-4.5 26.3 23.2 46 46.4 33.7L288 439.6l130.7 68.7c23.2 12.2 50.9-7.4 46.4-33.7l-25-145.5 105.7-103c19-18.5 8.5-50.8-17.7-54.6L382 150.2 316.7 17.8c-11.7-23.6-45.6-23.9-57.4 0z"></path></svg><svg class="svg-inline--fa fa-star fa-w-18 final-star" aria-hidden="true" data-prefix="fa" data-icon="star" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" data-fa-i2svg=""><path fill="currentColor" d="M259.3 17.8L194 150.2 47.9 171.5c-26.2 3.8-36.7 36.1-17.7 54.6l105.7 103-25 145.5c-4.5 26.3 23.2 46 46.4 33.7L288 439.6l130.7 68.7c23.2 12.2 50.9-7.4 46.4-33.7l-25-145.5 105.7-103c19-18.5 8.5-50.8-17.7-54.6L382 150.2 316.7 17.8c-11.7-23.6-45.6-23.9-57.4 0z"></path></svg><svg class="svg-inline--fa fa-star fa-w-18 final-star" aria-hidden="true" data-prefix="fa" data-icon="star" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" data-fa-i2svg=""><path fill="currentColor" d="M259.3 17.8L194 150.2 47.9 171.5c-26.2 3.8-36.7 36.1-17.7 54.6l105.7 103-25 145.5c-4.5 26.3 23.2 46 46.4 33.7L288 439.6l130.7 68.7c23.2 12.2 50.9-7.4 46.4-33.7l-25-145.5 105.7-103c19-18.5 8.5-50.8-17.7-54.6L382 150.2 316.7 17.8c-11.7-23.6-45.6-23.9-57.4 0z"></path></svg><svg class="svg-inline--fa fa-star fa-w-18 final-star" aria-hidden="true" data-prefix="fa" data-icon="star" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" data-fa-i2svg=""><path fill="currentColor" d="M259.3 17.8L194 150.2 47.9 171.5c-26.2 3.8-36.7 36.1-17.7 54.6l105.7 103-25 145.5c-4.5 26.3 23.2 46 46.4 33.7L288 439.6l130.7 68.7c23.2 12.2 50.9-7.4 46.4-33.7l-25-145.5 105.7-103c19-18.5 8.5-50.8-17.7-54.6L382 150.2 316.7 17.8c-11.7-23.6-45.6-23.9-57.4 0z"></path></svg></span></div><div class="widget-review-body"><div class="review-body"><span>"'+ListContent+'...<a  href="'+K_slit+'">More</a>"</span></div></div></div>';document.write(listing + '</div>');}document.write('</div>');}
    document.write("<script src='"+website+"/feeds/comments/default?alt=json-in-script&callback=cmts'></"+"script>");</script>     
      </div> 
    </div>
  12. Save widget.

Customising Review Style Recent Commnents blogger widget:

I think so this project will work properly for you and I think you will like it but before winding up I want to tell you that you have to make some customizations in the above code to make it work properly for you.

Change https://www.softwebtuts.com with your blog url.
Change 6 in var ListCount = 6; with the number of comments you want to show up.
Change 100 in var ChrCount = 100; with the number of characters to show of comment.

Conclusion:
After making these customizations you are all done now your Review Style Recent Comments Blogger Widget will work properly one thing you should keep in mind that the code above is compressed if you want to compress the code again then this widget will not work properly.

If You have any question leave your comments below.
Disqus Codes

No comments

Notifications

Disqus Logo