How to add comment section on blogskins Saturday, February 12, 2022 1 comment
HI~! So, if you're looking at your blogskins code or several on the internet that were reposted by bloggers out there... some of them had no comment box. I was struggling to edit this blog because I forgot how the fudge I added a comment section to my recent template. I'm posting this in case someday I forget it again.
- go to blogger > theme > edit html, look for
</style>
- paste this code above it
.comment-timestamp {margin:0 0 .5em;padding:0 0 .75em 20px;color:#555;}.deleted-comment {font-style:italic;color:gray;}#comments {margin:5;border-width:0 1px 1px;padding:20px 0 15px 0;}.comment-icon blogger-comment-icon{display:none}#comments-block {margin:2px ;}.comment-data {background:url("your icon url") no-repeat 2px .3em;margin-top:5px !important;background-size:10px;padding:0 0 0 20px;color:#666;}.avatar-image-container img{-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;border-radius:50%;}span.comment-icon{display:none}.comment-poster {font-weight:bold;}.comment-body {margin:0px;}.comment-body p {background:#FFFFFF;border:1px solid #ccc;margin:0;padding:5px;color:#555;}
- look for this code
<BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader>
- and paste this right after it as the comment-link after your entry title and date
<a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>> <$BlogItemCommentCount$> comment </a>
- look for this code
<$BlogItemBody$>
- paste this under it as the comment box
<itempage><div id="comments" style="margin-top:5px;"><blogitemcommentsenabled><a name="comments"></a><dl id="comments-block"><div style="width:470px; padding:5px;margin-top:20px;border:1px solid #bbb;6px;background:url(background url);"><$CommentPager$><blogitemcomments><dt class="comment-data" id="<$BlogCommentAnchorName$>"><a name="<$BlogCommentAnchorName$>"></a><$I18NCommentAuthorSaid$></dt><dd class="comment-body"><p><$BlogCommentBody$></p><$BlogCommentDeleteIcon$></dd></BlogItemComments></dl></div><p class="comment-timestamp"><$BlogItemCreate$></p></div></itempage>
- make sure you paste the comment box code above this code
<blogger>
Adjust the color and the background, preview, and save it. You're done! Hope it works. []
Labels: tutorial
comment
Post a Comment