How To Create A Comments Static Page On Blogger

How To Create A Comments Static Page On Blogger, How To Create A Static Page On Blogger,


Hello guys, welcome to infinity blogger, Today we are going to learn how to create a Comment Static Page in blogger.

What is a Static Page?

I know many of you are thinking that what is a Static Page, If you already have a blog and you are blogging from a long time then I think you know what is a static page in blogger, but if you don't know that what is a static page then don't worry I am here for you. If you created your website on blogger then you can see that there are many pages, many blogs, many posts are there, ok so that's a website, but the opposite of a website is a static page. A static page is a website of 1 page yeah you heard me right that a static page is a website that has only one page so that's called a static page. Static page websites are specially created for tool websites, like a duplicate checker, Age Checker, Code Generator, Etc. If you also want to create this type of static page website then comment below and I will surely create a post for that. You can also embed static page websites on any blogger templates, But sometimes it works sometimes not.

What is a comment static page?

If you have any website on blogger or WordPress doesn't matter but if you have it then you know we have to create some pages to get AdSense on our blog. Example: Contact Us, About Us, Etc.
Comment static page is also like a page that contains only comments that are commented on your blog. All the comments of your blog or website will show in one place on the comment static page.

Benefits of comment static page :

If your blog has high traffic then it's really helpful for you to manage your all comments in one place, many users comment on their problems in the post comment section but the problem is that you can't open every post in your blog and read the comments if you do this, it will take days to view all the comments in your blog. So here comes the comment static page to save your time, Comment static page also helps you to manage your comments very easily. You can read all your comments that are in your blog in one place and manage them. if you give the link of your comment static page on the home page or any other place then other users can also see your comment static page on your website or blog.

How to create a comment static page?

it's very easy and simple to create a comment static page on your blogger websites.
Please follow all the steps very carefully and if you face any problem then contact me on my telegram.

Steps:

  • Go to blogger.com
  • Log in then go to your dashboard
  • Click on the pages
  • Then click on create new page
  • First give a title, whatever you want, like comments or new comments...
  • Then copy all the code given below and then paste it on your page.
  • Before saving it please change your blog I'd marked with red and also change your website link marked with yellow.
  • Then save. It's Done. ENJOY.

<style>
  #CommentUI ul{margin:0!important;padding:0}
#CommentUI li{position:relative;padding:8px 12px;border-radius:18px;list-style:none}
#CommentUI .CommentInfo{}
#CommentUI .AvatarImg{display:flex;align-items:center;position:absolute;width:40px;height:40px;border-radius:50%;overflow:hidden;transition:all .2s ease-out;-webkit-transition:all .2s ease-out}
#CommentUI img{margin:0!important;padding:0!important;width:45px;height:45px;border-radius:50%;background:url(https://i.imgur.com/TsS2wN3.png) no-repeat center}
#CommentUI .CommentUi a{color: #343a40;font-size: 13px;}
#CommentUI .CommentBlock .CommentInfo{float:left;position:absolute;width:100%}
#CommentUI .CommentBlock a{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:15px 0 0}
#CommentUI .CommentUi{background:#f0f2f5;margin-left:50px;border-radius:8px;padding:8px 12px}
#CommentUI .CommentBlock a:hover{opacity:.85}
#CommentUI .userName{flex: 0 0 auto;display: flex;align-items: flex-start;font-size: 13px;font-weight: 700;color: #161617;}
#CommentUI .userName span {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;max-width: 130px;}
#CommentUI .dateTime{font-size: 11px;color: #989b9f;margin-top: -10px;position: absolute;}
@media only screen and (max-width: 640px) {
#CommentUI li {padding: 0;}
#CommentUI li {margin-bottom: 10px;}}
</style>
<div id='CommentUI'>
<script type="text/javascript">//<![CDATA[
var copyright_by_duypham_dot_info='Recent Comments free version 3.2 by http://duypham.info';
nc=200;
length_name=30;
length_content=300;
no_avatar='https://1.bp.blogspot.com/-EpVyZQmKvMk/X6A0d8aUvII/AAAAAAAAABo/mUJf5QCM41symJP6c4UGdCDHsxIXHb_rQCLcBGAsYHQ/s2048/20201102_213313.jpg';
home_page='https://www.infinityblogger.in/';
admin_uri='https://www.blogger.com/profile/00000123456789';
admin_avatar='https://1.bp.blogspot.com/-EpVyZQmKvMk/X6A0d8aUvII/AAAAAAAAABo/mUJf5QCM41symJP6c4UGdCDHsxIXHb_rQCLcBGAsYHQ/s2048/20201102_213313.jpg';
function rc_avatar2(a) {
    -1 != d[u].indexOf("/p/") ? (pn[u] = 1, o = a.entry.title.$t, t[u] = o) : (o = a.feed.title.$t, t[u] = o, num = a.feed.openSearch$totalResults.$t, i = parseInt((num - 1) / 200) + 1, pn[u] = i), u++
}

function rc_avatar1(t) {
    tt = t.feed.openSearch$totalResults.$t, tb = t.feed.title.$t, "uri" in t.feed.author[0] && (ura = t.feed.author[0].uri.$t), ima = t.feed.author[0].gd$image.src;
    for (g = 0; g < nc && g < tt && (c = t.feed.entry[g], g != t.feed.entry.length); g++) {
        if (lk = c.link[0].href, lk = lk.split("/"), bid = lk[4], pid = lk[5], cid = lk[8], d[g] = c["thr$in-reply-to"].href, -1 != y && (d[g] = d[g] + "?m=0"), pi[g] = c.gd$extendedProperty[0].value, ti[g] = c.gd$extendedProperty[1].value, p[g] = cid, "content" in c) var e = c.content.$t;
        else if ("summary" in c) e = c.summary.$t;
        else e = "&#8592;";
        if ((e = (e = (e = e.replace(/<br \/>/g, " ")).replace(/@<a.*?a>/g, "")).replace(/<[^>]*>/g, "")).length < length_content) j2[g] = e;
        else {
            var r = (e = e.substring(0, length_content)).lastIndexOf(" ");
            e = e.substring(0, r), j2[g] = e + "&#133;"
        }
        if (a2 = c.author[0].name.$t, a2.length < length_name) a[g] = a2;
        else {
            a2 = a2.substring(0, length_name);
            r = a2.lastIndexOf("");
            a2 = a2.substring(0, r), a[g] = a2 + "&#133;"
        }
        "uri" in c.author[0] && (ur[g] = c.author[0].uri.$t), "http://img1.blogblog.com/img/blank.gif" == c.author[0].gd$image.src ? (im[g] = no_avatar, alt[g] = "no avatar") : (im[g] = c.author[0].gd$image.src, alt[g] = a[g]), -1 != d[g].indexOf("/p/") ? document.write('<script type="text/javascript" src="https://www.blogger.com/feeds/' + bid + "/pages/default/" + pid + '?alt=json-in-script&callback=rc_avatar2"><\/script>') : document.write('<script type="text/javascript" src="' + home_page + "/feeds/" + pid + '/comments/default?alt=json-in-script&max-results=1&callback=rc_avatar2"><\/script>')
    }
}

function AvatarImg() {
    var e = "";
    for (e += "<ul>", z = 0; z < nc && z < tt; z++) {
        t[z] = t[z].replace("Comments on " + tb + ": ", "");
        var r = "";
        1 == pn[z] ? r = "#c" : (cp = "commentPage=" + pn[z] + "#c", r = -1 != y ? "&" + cp : "?" + cp), e += '<li class="',  e += "CommentBlock", e += '"><div class="AvatarImg"><img alt="' + alt[z] + '" class="AvatarImg" src="' + im[z] + '"/></div><div class="CommentUi"><div class="commentHeader"><span class="userName"><span itemprop="name">' + a[z] + '</span></span><time class="dateTime">' + ti[z] + '</time></div><a href="' + d[z] + r + p[z] + '" rel="nofollow" title="Nhấn vào để xem nhận xét"><div class="commentContent" itemprop="text">' + j2[z] + "</div>",  e += '</a></div><div class="clear"></div></li>'
    }
    e += "</ul>", document.getElementById("CommentUI").innerHTML = e
}
tt = 0, u = 0, lk = [], d = [], p = [], pn = [], j2 = [], tb = [], t = [], pi = [], ti = [], a = [], im = [], alt = [], ur = [], ura = [], ima = [], ad = "duypham", loc = "http://", dot = ".", inf = "info", a3 = location.href, y = a3.indexOf("?m=0"), copyright_by_duypham_dot_info == "Recent Comments free version 3.2 by " + loc + ad + dot + inf && document.write('<script type="text/javascript" src="' + home_page + "/feeds/comments/default?alt=json-in-script&max-results=" + nc + '&callback=rc_avatar1"><\/script>');
  //]]>
</script>
<script type='text/javascript'>AvatarImg();</script>
</div>

Note:

Dont Forget To Change URL With Your Website URL And Your Blog Profile Id.
home_page = ' https://www.infinityblogger.in/ ';
admin_uri = ' https://www.blogger.com/profile/00000123456789 '/;

All Done! ENJOY
 Demo