Reply Button to Blogger Comments

In our featured post today, I’ll bring you to a tutorial by Wajahat Ahmed of BlueKut on how you can add a cool reply button to Blogger comments.
Follow these simple steps:

• Go to Blogger Dashboard > Template > Edit HTML.

• Click Proceed > click the Expand Widget Templates box.

• Search this code on your template’s HTML.

<data:commentPostedByMsg/>

• Paste this code after the above code.

<a href='http://www.BlueKut.com'><img alt='Best Blogger Tips' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8qL2qn6t_khc9FAKKC2pNx4TWFn_Gtur6tpmlgZvDylTxcKR4gUjed5hjKoSl_yyH1mY6wxGn48z-CRryCZ_UglWhDxcQzY4eMytwwbQvG31z3ccyaHVGGlauxn_JYFfyDcBJcgIL5H1c/s1600/best+blogger+tips.png'/></a><span class='comment-reply'><a expr:href='&quot;https://www.blogger.com/comment.g?blogID=YOUR-BLOG-ID&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=400,height=450&quot;); return false;'>Reply it</a></span><a href='http://www.blueKut.com'><img alt='Best Blogger Templates' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8qL2qn6t_khc9FAKKC2pNx4TWFn_Gtur6tpmlgZvDylTxcKR4gUjed5hjKoSl_yyH1mY6wxGn48z-CRryCZ_UglWhDxcQzY4eMytwwbQvG31z3ccyaHVGGlauxn_JYFfyDcBJcgIL5H1c/s1600/best+blogger+tips.png'/></a>

• Save.

Here’s his tip to make it stylish.
If you want to make the button silver, follow the instructions below:

• Find .post h3 {

• Copy the code below and paste above step 3.

.h12 {

 -moz-box-shadow:inset 0px 1px 0px 0px #ffffff;

 -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;

 box-shadow:inset 0px 1px 0px 0px #ffffff;

 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );

 background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );

 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');

 background-color:#ededed;

 -moz-border-radius:6px;

 -webkit-border-radius:6px;

 border-radius:6px;

 border:1px solid #dcdcdc;

 display:inline-block;

 color:#777777;

 font-family:arial;

 font-size:15px;

 font-weight:bold;

 padding:1px 21px;

 text-decoration:none;

 text-shadow:1px 1px 0px #ffffff;

}/*Bluekut.com */

.h12:hover {

 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );

 background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );

 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');

 background-color:#dfdfdf;

}.h12:active {

 position:relative;

 top:1px;

}

/* This imageless css button was generated by Bluekut.com */ 

• Save.

To know more about this awesome tutorial, click HERE.