Customized comment box can increase the attraction of your blog. It's special Hover effects make's it more attractive. Adding this custom comment box design to blogger is very easy. It can be integrated into your blog in just few minutes. You can also easily customize this design according to your blog`s design. It will match your blog`s color scheme perfectly.Check Below images before proceeding to the installation.
Now, let's start step by step guide to customize comment box
Step 1: If you are using Google+ comment box disable it first. For that go to Setting>Posts,comments and sharing>Google+ comments.
Step 2: Now Go to Theme (Template) > Edit HTML. Click any where in the codes and press Ctrl + F.
Step 3: Search for below code, Search codes will appear two times modify both.
Customization
![]() |
BEFORE CLICK OR HOVER |
![]() |
AFTER CLICK OR HOVER |
Now, let's start step by step guide to customize comment box
Step 1: If you are using Google+ comment box disable it first. For that go to Setting>Posts,comments and sharing>Google+ comments.
Step 2: Now Go to Theme (Template) > Edit HTML. Click any where in the codes and press Ctrl + F.
Step 3: Search for below code, Search codes will appear two times modify both.
<div class='comment-form'>Step 4: Replace above codes with:
<div id='livethreads'>Step 5: Now Search for ]]>< and above it paste the below codes.
Step 6: Save Theme (Template), That's it.#livethreads iframe{background:#ffffff url(https://2.bp.blogspot.com/-2WBYxLCI0Z8/WL1Ca40Wg-I/AAAAAAAABAQ/az8Q0GdO3hsoD_3kKuzDPcdP3d6dGypXACLcB/s1600/email-29853_960_720.png) no-repeat bottom center;border:4px solid #000000;padding:0px; font:normal 12pt "Times New Roman", Arial; color:#02d4f9; margin:auto; }#livethreads iframe:hover{background:#def8f9 url(https://1.bp.blogspot.com/-vOLLVfHl9WE/WL1Cd9fuyjI/AAAAAAAABAc/sgpZ6KTfPKcGMWMykix6ffCHfx8XrxiZQCLcB/s1600/email-29853_960_720.png) no-repeat bottom right; border:4px solid #02d4f9;}#livethreads a{color:#02d4f9;}
Customization
- Change blue background text with your desired border Hex Code.
- Change Red background text to change before and after background colors.
- Change yellow background text to change position of image.
- Change green background text with your image url. Only if you want a different image.
- Change orange background text with your desired hover color.
Nice Post! Thankyou!!
ReplyDelete👍
DeleteWow! This article is great! – I learn something new everyday! Thank you! If you don’t mind, I’d like to reference this post on my blog. I will link back to this post. Thanks again! https://royalcbd.com/faq/
ReplyDeleteCustom packaging boxes with logo offer you the best custom Boxes, which will shield your customer in addition to give it a picture-perfect look. CPP Boxes
ReplyDeletedfdf
ReplyDeletedf
Delete