How to add Delete Button in Blogger Comments | LayZee UI | Kaily

How to add Delete Button in Blogger Comments | LayZee UI | Kaily

 Hey, there! Welcome to Kaily.in

"How do I delete a comment on my website?" or to be more specific "How do I delete a comment on my Blogger website (LayZee UI)?"

by default the LayZee UI template doesn't have a delete comment button. so for those of you who want to add it, you can follow the guide below.

because each theme has a different code structure, so I made a special tutorial that uses the same template as mine, please modify the template yourself.

---

note
Users with must be on version layzeeui@1.20.0 or above

Add Delete Button in LayZee UI Comments

the first step, please look for the css as below, if you have found it, just delete it so it doesn't clash with the css that I will give later, there are 3 css lines that you need to delete.

<!-- remove this CSS -->
.cmRi:checked ~ .cmRp .thTg::after{content:attr(aria-label)}

<!-- remove this CSS -->
.thTg::before{content:'';width:28px;border-bottom:1px solid var(--widgetTac);opacity:.5}

<!-- remove this CSS -->
.thTg::after{content:attr(data-text);margin:0 12px;opacity:.7}

---

after you have deleted the css above, you can add this css so that it looks neater.

.cmHl .thCh a.deleteCm{position:absolute;right:10px;top:0}
.cmHl a.deleteCm{position:absolute;right:20px;top:10px}
.cmHl .thCh a.deleteCm svg,.cmHl a.deleteCm svg{width:20px;stroke:#989b9f}
.thTg::after{content:'';right:0;left:10rem;width:calc(100% - 13rem);border-bottom:1px solid var(--widgetTac);opacity:.5;position:absolute}
.thTg::before{content:attr(data-text);margin:0 12px;opacity:.7}
.cmRi:checked ~ .cmRp .thTg::before{content:attr(aria-label)}
.thCh > li:first-of-type:before{content:'';border:0}
.thCh > li:before{content:'';position:absolute;width:calc(100% - 3.8rem);border-top:1px solid var(--widgetTac);opacity:.5;left:20px;margin-top:-10px}

---

then please follow the instructions below, search and change, do it carefully, there are 2 things that need to be changed, but the code is almost similar, so don't be mistaken.

<li class='c' expr:id='&quot;c&quot; + data:commentLevel1.id'>

<li class='c' expr:id='&quot;c&quot; + data:commentLevel1.id'>
<a aria-label='Delete' class='deleteCm' expr:href='&quot;https://www.blogger.com/delete-comment.g?blogID=&quot; + data:blog.blogId + &quot;&amp;postID=&quot; + data:commentLevel1.id' rel='nofollow noopener noreffer' target='_blank'><svg class='line' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(3.500000, 2.000000)'><path d='M15.3891429,7.55409524 C15.3891429,15.5731429 16.5434286,19.1979048 8.77961905,19.1979048 C1.01485714,19.1979048 2.19295238,15.5731429 2.19295238,7.55409524'/><line x1='16.8651429' x2='0.714666667' y1='4.47980952' y2='4.47980952'/><path d='M12.2148571,4.47980952 C12.2148571,4.47980952 12.7434286,0.714095238 8.78914286,0.714095238 C4.83580952,0.714095238 5.36438095,4.47980952 5.36438095,4.47980952'/></g></svg>
</a></li>

---

<li class='c' expr:id='&quot;c&quot; + data:commentLevel2.id'>

<li class='c' expr:id='&quot;c&quot; + data:commentLevel2.id'>
<a aria-label='Delete' class='deleteCm' expr:href='&quot;https://www.blogger.com/delete-comment.g?blogID=&quot; + data:blog.blogId + &quot;&amp;postID=&quot; + data:commentLevel2.id' rel='nofollow noopener noreffer' target='_blank'><svg class='line' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><g transform='translate(3.500000, 2.000000)'><path d='M15.3891429,7.55409524 C15.3891429,15.5731429 16.5434286,19.1979048 8.77961905,19.1979048 C1.01485714,19.1979048 2.19295238,15.5731429 2.19295238,7.55409524'/><line x1='16.8651429' x2='0.714666667' y1='4.47980952' y2='4.47980952'/><path d='M12.2148571,4.47980952 C12.2148571,4.47980952 12.7434286,0.714095238 8.78914286,0.714095238 C4.83580952,0.714095238 5.36438095,4.47980952 5.36438095,4.47980952'/></g></svg>
</a></li>

---

Conclusion

This is all about  How to add Delete Button in Blogger Comments. I hope you enjoy this article. Please do share this article. And if you are facing problem in any section or you have any question then ask us in Comment Section Thank You!

Credit:
www.kaily.in