Saturday, October 27, 2012

Custom CSS code for intensedebate commenting systems

Intensedebate commenting system is one of the best system for the bloggers who are in need of changing their blogger commenting system completely to like WordPress commenting system. I had already posted about this intensedebate commenting system. And now here I am with a customized css code that can make your commenting style completely look like a WordPress comment system.

This is what makes intensedebate a good commenting system for bloggers.They allow customizing the comment system style by simply adding css code. So You can easily add the css code and then easily customize the style as per your wish.

How To Add Customized CSS Code?

Intensedebate allow you to add a customized css code. For adding customized code, go to settings on intensedebate account where you will see an option "Custom CSS". Click on the option and add the CSS codes given below. And then save the settings.

.idc-postnav-label { display: none !important; }
.idc-postnav-list { display: none !important; }
.idc-foot { display: none !important; }
#idc-container div.idc-text_noresize, #idc-container textarea.idc-text_noresize {height: 100px !important;}/*Pad and prepare new comment and reply comment boxes */

#IDCommentsNewThread {position: relative !important;padding-top: 80px !important;}
#IDCommentReplyForm1{position: relative !important;padding-top: 80px !important;}

#IDCommentReplyDiv{position: relative !important} /*Prepare reply comment for positioning */
#IDCommentReplyForm2{position: absolute !important; top: 31px !important; left: 20px !important;}
#IDCommentNewThreadForm2 {position: absolute !important; top: 7px !important; left: 0px !important;width: 100% !important;}

#luv_field_new {position: absolute !important;top: 10px !important;left: 0 !important;}
#luv_field_reply {position: absolute !important;top: 10px !important;left: 0 !important;}

#all_luv{font-weight:bold !important;} /*Bold the text for comment luv */
span#mylastpost img:first-of-type { display: none !important; }

What Changes Can Happened After Adding The CSS Code?

After adding the CSS code, there will be a major change happening in the intense-debate comment box. It will completely change the style of the comment box and will look like a WordPress comment box. No one will realize that it is a third party comment box.  After adding the code the comment box will look like the picture given below.



Following are the changes that will happen on a default comment box style.

1. Name,email and website boxes will appear above the comment box

2. intensedebate logo and comment luv image will be hidden

3. There won't be any login button

4. It will be a clean and neat comment box style.

Related Posts Plugin for WordPress, Blogger...

ShareThis

Twitter Delicious Facebook Digg Stumbleupon Favorites More